Question

运行此命令时出现错误：“未捕获的TypeError：this.thePerson不是函数”

var myApp = new Vue({
    el: "#app",
    data: {
        person: [this.thePerson()]
    },
    methods: {
        thePerson: function() {
            return {
                personNickname: "Bob",
                personOwes: 0,
                paymentType: {
                    card: true,
                    cash: false
                }
            };
        }
    }
});

我不知道为什么！

P.S。我意识到这看起来很奇怪，但是我使用函数返回数组内容是有原因的。

Answer 1

您是否尝试通过Vue的创建方法分配人员值？

根据您的示例：

    var myApp = new Vue({
  el: "#app",
  data: {
      person: []
  },
  methods: {
      thePerson: function() {
          return {
              personNickname: "Bob",
              personOwes: 0,
              paymentType: {
                  card: true,
                  cash: false
              }
          };
      }
  },
  created(){
    this.person.push(this.thePerson())
  }
});

Answer 2

将data转换为函数。

var myApp = new Vue({
    el: "#app",
    data: function() {
        return {
            person: [this.thePerson()]
        }
    },
    methods: {
        thePerson: function() {
            return {
                personNickname: "Bob",
                personOwes: 0,
                paymentType: {
                    card: true,
                    cash: false
                }
            };
        }
    }
});

未捕获的TypeError：从Vue中的数据调用方法时不是函数

2 个答案: