uni-app 页面跳转报错 TypeError: Cannot read properties of undefined (reading 'split')

发布于 1周前 作者 sinazl 来自 Uni-App

uni-app 页面跳转报错 TypeError: Cannot read properties of undefined (reading ‘split’)

开发环境 版本号 项目创建方式
Windows HBuilderX

产品分类:uniapp/H5

PC开发环境操作系统:Windows

HBuilderX类型:正式

HBuilderX版本号:4.26

浏览器平台:Chrome

浏览器版本:128.0.6613.137


操作步骤:

onSubmit(values) {  
uni.redirectTo({  
            url: '/pages/main'  
          });  
}

预期结果:

  • 正常跳转

实际结果:

chunk-vendors.js:31372 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'split')
at as (chunk-vendors.js:31372:12)
at vs (chunk-vendors.js:31478:9)
at Is (chunk-vendors.js:31485:14)
at invoke (chunk-vendors.js:31565:29)
at S (chunk-vendors.js:33945:506329)
at O (chunk-vendors.js:33945:507319)
at chunk-vendors.js:33945:411066
at new Promise (<anonymous>)
at Object.redirectTo (chunk-vendors.js:33945:411032)
at eval (login.vue:272:1)

bug描述:

我在第一次进入到app/H5的登录界面时候,使用登录按钮进行页面跳转,会报错

chunk-vendors.js:31372 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'split')
at as (chunk-vendors.js:31372:12)
at vs (chunk-vendors.js:31478:9)
at Is (chunk-vendors.js:31485:14)
at invoke (chunk-vendors.js:31565:29)
at S (chunk-vendors.js:33945:506329)
at O (chunk-vendors.js:33945:507319)
at chunk-vendors.js:33945:411066
at new Promise (<anonymous>)
at Object.redirectTo (chunk-vendors.js:33945:411032)
at eval (login.vue:272:1)

14 回复

你好,可以提供一个测试项目吗?看一下你具体是咋用的


您好,可以的,我这边也发现了问题的诱因,是我使用了云函数以后似乎就会有这个问题,我应该怎么把测试项目发过来呢

回复 圆白菜: 你可以这样,尝试把相关的逻辑提取出来,新建一个测试项目发过来。

在下方评论区有一个上传附件,可以上传压缩包

回复 DCloud_UNI_yuhe: 好的,我放到下面的评论里了

项目问题:在绑定了云函数的云服务空间后,通过登录按钮调用uni.redirectTo无法跳转,但是在onload中调用可以跳转。 在解绑云函数并删除云函数文件,重新打包自定义基座后,问题消失

你好,我下载了你发的附件,好像不能直接运行,你可以发一个可以直接运行到项目吗?

回复 DCloud_UNI_yuhe: 我试了下好像没问题呀,您下载完解压,然后hbuilder打开,选择运行到浏览器试一下

回复 DCloud_UNI_yuhe: 或者您这边可以加我的联系方式,方便沟通

回复 圆白菜: 可以点击我的头像私信我

我这里尝试运行你的代码,但是有非常多的报错

不好意思昨天下班了没看到回复,麻烦看下私信

老铁这个解决了吗

针对您提到的 uni-app 页面跳转时遇到的 TypeError: Cannot read properties of undefined (reading 'split') 错误,这通常意味着在某处尝试对一个未定义(undefined)的变量执行 split 方法。split 是一个字符串方法,用于将字符串分割成数组,如果尝试在非字符串类型(尤其是未定义)上调用它,就会抛出此类错误。

以下是一些可能导致此错误的常见场景及相应的代码检查和修正方法:

场景 1: 传递错误的参数

假设在页面跳转时,您可能传递了一个未定义的参数,然后在目标页面尝试分割这个参数。

错误示例

// 假设在页面A
uni.navigateTo({
    url: `/pages/pageB/pageB?id=${undefinedVar}`
});

// 在页面B
onLoad(options) {
    const parts = options.id.split('-'); // 如果options.id是undefined,这里会报错
}

修正

// 在页面B增加检查
onLoad(options) {
    if (options.id && typeof options.id === 'string') {
        const parts = options.id.split('-');
        // 使用parts做进一步处理
    } else {
        console.error('Invalid ID:', options.id);
    }
}

场景 2: 错误的变量赋值

可能在某个处理逻辑中,变量被意外赋值为 undefined

错误示例

let someVar;
// some logic that should assign a string to someVar but fails
// ...
const parts = someVar.split('-'); // someVar is undefined

修正

let someVar = ''; // 初始化为一个空字符串或其他默认值
// your logic here
if (typeof someVar === 'string') {
    const parts = someVar.split('-');
    // 使用parts做进一步处理
} else {
    console.error('someVar is not a string:', someVar);
}

总结

在处理类似错误时,关键是确保在调用 split 方法之前,变量已经被正确定义并赋值为一个字符串。使用 if 语句检查变量是否存在且为字符串类型是一个好习惯。此外,对于从外部输入(如URL参数)获取的数据,总是进行必要的验证和错误处理,以避免运行时错误。

希望这些示例能帮助您定位并修复问题。如果问题依旧存在,可能需要更详细地检查相关代码逻辑或提供更多的上下文信息。

回到顶部