解决Vue异步请求中this为undefined以及mounted中获取不到data的数据的问题 起因 使用Nuxt做项目要实现视频点播功能,视频存在阿里云,整合了一个阿里云播放器,在created中使用封装的异步请求获取视频的vid和播放凭证,但是发现后端接口提示获取视频id失败。 <template> <div> <!-- 阿里云视频播放器样式 --> <link
如果试图从Vue组件上的箭头函数内部访问this,将得到一个错误,因为this不存在 代码语言:javascript 代码运行次数:0 运行 AI代码解释 data(){return{text:'This is a message',};},methods:{arrowFunction:()=>{console.log(this.text);// ERROR! this is undefined}} 简而言之,尽量避免在Vue组件上使用箭头函数。
在Vue.js中,变量或属性可能会在以下几种情况下变为undefined:1、未初始化,2、异步数据未返回,3、属性不存在,4、作用域问题,5、访问嵌套对象。具体原因和解决方法如下: 一、未初始化 当变量或属性在组件中声明但未初始化时,其默认值为undefined。这通常发生在组件的data函数中未正确设置默认值。 export default ...
如果试图从Vue组件上的箭头函数内部访问 this,将得到一个错误,因为 this 不存在 data() { return { text: 'This is a message', }; }, methods: { arrowFunction: () => { console.log(this.text); // ERROR! this is undefined } } 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 简而言之,尽量...
},methods: {arrowFunction:() =>{console.log(this.text);// ERROR! this is undefined} } 简而言之,尽量避免在Vue组件上使用箭头函数。这将会省去许多头痛和困惑的问题。 有时使用箭头函数是很好的,但这只在不引用this的情况下才有效。 computed: { ...
console.log(this.text); // ERROR! this is undefined } } 简而言之,尽量避免在Vue组件上使用箭头函数。这将会省去许多头痛和困惑的问题。 有时使用箭头函数是很好的,但这只在不引用this的情况下才有效。 computed: { location: () => window.location, ...
console.log(this.text); // ERROR! this is undefined } } 简单粗暴的做法就是不要在 Vue 组件里用箭头函数。这样会替你省掉不少麻烦和困惑。 既然this是罪魁祸首,箭头函数只是背锅侠,那有时候还是可以用箭头函数的,只要你没有用到this: computed: { ...
log(_this.index[0]); }); console.log("mounted"); } 不出意外的话,你会发现这两种情况依然会抛出undefined的错误。 但是这里与逻辑是相悖的,既然我选择在页面渲染之前获取到数据,为什么依然会报错? 猜测:网络问题 由于axios是异步的,也许在created时,真的执行了axios语句,但是由于网络问题,加载的时间大于...
首先vue是没有定义一个vm这个变量. 所以打印出来是undefined在正常不过var vm = new Vue()这样才能够 有用 回复 Aaron 2881526 发布于 2017-08-07 确实,vue是在mounted的时候才创建DOM对象并返回实例,所以created的时候并还没有执行实例化,可以尝试下在控制台打印,应该就可以打印出来 ...
父组件传递给子组件值,子组件使用插值表达式可以渲染,放在created函数中提示undefined 截图 父组件 子组件 二、原因分析 应该是 顺序的问题(生命周期的问题),在子组件created中调用getInfo()函数的时候,props还没有传值 所以出现 created里面的却不会发生改变, 子组件的html中的{{{principalID}}的值虽然会随着父组...