账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    Property 'activeName' does not exist on type 'Vue'
    • 2019-05-05 00:00
    • 10
    49
    0

    问题描述

    Property 'activeName' does not exist on type 'Vue'

    问题出现的环境背景及自己尝试过哪些方法

    vue-property-decorator
    在beforeRouteEnter中给属性初始化时，提示Property 'activeName' does not exist on type 'Vue'

    相关代码

    <script lang="ts">
    import { Component, Vue, Watch } from "vue-property-decorator";
    @Component({
      components: {},
      beforeRouteEnter(to:any, from: any, next){
        next(vm => {
            console.log('vm-->', vm)  //打印vm中存在activeName这个属性
            vm.activeName = 'date'   
            //  此处提示：Property 'activeName' does not exist on type 'Vue'
        })
      }
    })
    export default class Demo extends Vue {
        activeName:string = 'date'
    }
</script>

    你期待的结果是什么？实际看到的错误信息又是什么？

    1、在beforeRouteEnter中打印 vm这个对象，是存在 activeName这个属性的
    2、但是在使用 vm.activeName = 'date' 进行初始化时，提示：Property 'activeName' does not exist on type 'Vue'

    尝试过的方法：
    在my-property.d.ts文件中，将需要初始化的属性进行全局注册。但是这个方法，如果我很多文件需要使用不同的属性，那我就需要在这个文件中，每次需要使用到哪个属性，都进行全局注册一次，显得麻烦。各位大神有没有其他的解决办法？

    // 1. 确保在声明补充的类型之前导入 'vue'
import Vue from 'vue'
// 2. 定制一个文件，设置你想要补充的类型
//    在 types/vue.d.ts 里 Vue 有构造函数类型
declare module 'vue/types/vue' {
// 3. 声明为 Vue 补充的东西
  interface Vue {
    $msg: Function,
    $bus:Vue,
    activeName: string
  }
}
    1
    打赏
    收藏
    点击回答
    您的回答被采纳后将获得：提问者悬赏的 10 元积分
        全部回答
    • 共 0 条
    • 转圈的旅人 普通会员 1楼

      The error message "Property 'activeName' does not exist on type 'Vue'" is indicating that the variable "activeName" is of type "Vue" but the function or expression you are trying to call on it is not expecting it to have that type. Here's a breakdown of what's happening:

      1. The error is occurring because the activeName variable is defined as a property of the type "Vue" in the following line: javascript const activeName = this.activeName;

      The this keyword is used to refer to the Vue instance in this code. When you try to access the activeName property on this instance, you're accessing the internal activeName property of the Vue instance, which is a string literal (i.e., "activeName").

      1. However, the function or expression you are trying to call on activeName is trying to use it as a Vue object property, which is not possible when the activeName variable is of type "Vue". When a variable is of type "Vue", it refers to a singleton object that contains a single instance of the Vue class. This object has properties and methods that are specific to Vue, such as the activeName property in this case.

      2. To fix this error, you need to make sure that the activeName variable is not a Vue object property and that it refers to a string literal. Here's an example of how you can do this:

      ```javascript const activeName = 'activeName';

      // Example usage: call the 'activeName' property directly const name = activeName; console.log(name); // Output: activeName

      // Call the 'activeName' property as a string literal const name = 'activeName'; console.log(name); // Output: activeName ```

      In the example above, we initialize the activeName variable as a string literal "activeName", and then we call the activeName property directly without using the this keyword or as a Vue object property. This allows us to access and use the activeName property correctly in the function or expression.

      By making sure that activeName is not a Vue object property, the error should be resolved.

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部