如何将 属性 设置为在 vue js 数据中定义的对象?

How to set a property to an object that defined in vue js data?

我试图将 属性 设置为使用原型在数据中定义的空对象,但我得到一个错误,指出该对象未定义,我在使用 [=18= 时看到错误],我必须做什么?

这适用于 vue@2.6.10,也使用 vue-router@3.1.3 和 vuex@3.1.1。 下面的代码是导入另一个组件的一部分。

<template>
  <input class="input" v-model="RealName" placeholder="Your Name"/>
  ...
</template>
<script>
export default {
  name: "Person",
  data() {
    return {
      Email: null,
      RealName: null,
      Ncode: null,
      City: null,
      Education: null,
      Phone: null,
      static: {}
    }
  },
  watch: {
    RealName: function(changed, lastOne){

      this.static.prototype.firstRealName = this.static.firstRealName | lastOne // -- Ttrouble -- 

      console.log(this.static.firstRealName + ': ' + lastOne +' => ' + changed)
    }
  }
};
</script>

当我编辑输入时,我在控制台上收到此错误: “类型错误:无法设置未定义的 属性 'firstRealName' ...”

this.static.prototype 未定义。您已将 static 初始化为空对象 {},其中没有定义 prototype 属性。因此你不能做 this.static.prototype.firstRealName.

this.static.prototype.firstRealName = this.static.firstRealName
            ^                                     ^
            undefined                             undefined

访问未定义的 属性 对象是可以的,如 this.static.firstRealName,但是你不能访问 undefined 对象的 属性,如 [=16] =].您无法访问未定义对象 (prototype) 的 属性 firstRealName

您需要预先定义属性:

data() {
  return {
    Email: null,
    RealName: null,
    Ncode: null,
    City: null,
    Education: null,
    Phone: null,
    static: {
      prototype: {}  // need to define it up front
    }
  };
},

记住 Vue 中的 change detection caveats

而不是

this.static.prototype.firstRealName = this.static.firstRealName | lastOne

你可以使用

this.$set(this.static, "firstRealName", this.static.firstRealName | lastOne);

文档here