首页 > 其他分享 >Vue3组件Props属性名不能与Setup()中变量名不可重复

Vue3组件Props属性名不能与Setup()中变量名不可重复

时间:2022-11-20 21:25:17浏览次数:60  
标签:npm Vue3 run Setup props 报错 Props total setup


npm run lint,显示错误点:

30:9   error  Getting a value from the `props` in root scope of `setup()` will cause the value to lose reactivity  vue/no-setup-props-destructure

查看第30行代码:

setup ( props ) => {   ....   let total = props.total   .... }

原因是变更名“total”与“ props.total”同名了,npm run serve编译通过,但运行npm run lint或npm run build,会报错。

另外,在return { total },也会报错,所以在返回值中不能重复输出total。

 

标签:npm,Vue3,run,Setup,props,报错,Props,total,setup
From: https://www.cnblogs.com/nbwsj/p/16909566.html

相关文章

  • Vue3笔记 - 浅析Vue2和Vue3响应式原理及两者差异
    浅析Vue2和Vue3响应式原理及两者差异目录浅析Vue2和Vue3响应式原理及两者差异vue2的响应式vue2中为数据添加响应式模拟Vue2实现响应式原理vue3的响应式vue3中为数据添加响......
  • vue3和vue2的区别
    1、vue3完全支持typescript,提高项目的可维护性2、Fragment:模板更简单。vue3用到了一个虚拟的父级,可以多个根节点domvue2只能有一个父级节点3、vue2用newVue();vu......
  • vue3 基础-API-computed
    API-computed基本使用前些章节讲了一些常用的api如setup,ref,reactive,toRef...等,并以一个todoList的小案例来体现在vue3中如何进行......
  • vue3 基础-API-watch 和 watchEffect
    watch和watchEffect前篇对computed属性如何在api中基本使用,即从vue中引入,然后通过直接传函数或者传对象的方式,开箱即用,非常清晰易......
  • Vue3 之 ref、shallowRef、customRef
    ref把对象转化为响应式的;shallowRef是浅层响应式数据,即:只有对value整体修改,才能更新到视图层。而修改具体属性值时,不会更新视图。(shallowReactive和shallowRef一样的......
  • Vue3 npm 命令解析
    我们使用npmrunxxx命令,在nodeMoudles里面,vite目录做了一个软链接,然后去软链接下面的目录去找,有3个vite的配置,适应不同的平台做的(unix、windows、mac等)流程:1、本地n......
  • vite创建一个vue3项目
    vite创建vue3npmcreatevite@latest回车后输入项目名,选择vue即可安装vue-routernpminstallvue-router@4安装pinia使用pinia代替vuexnpminstallpini......
  • vue3学习笔记(一)
    helloworld<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title>ECharts</title><!--方法有用--><!--<scriptsrc="https://unpkg.c......
  • vue3学习笔记(二)
    应用&组件实例//应用实例constapp=Vue.createApp({data(){return{count:4}}})//组件实例constvm=app.mount('#app')console.log(vm.count......
  • How to setup Visual Studio Code to detect and set the correct encoding on file o
    HowtosetupVisualStudioCodetodetectandsetthecorrectencodingonfileopen回答1Addguidebyimage:File>>Preferences>>SettingsEnterautoGuess......