vue.js - 如何在 Vuejs 的 main.js 中使用 Mixin？

Question

我正在尝试使用来自 mixin 的全局信息。我打算访问getNow组件中的计算道具，但它似乎是undefined.

主.js：

Vue.mixin({
    data: function() {
        return {
          chainBoxURL: "http://172.22.220.197:18004/jsonrpc"
        }
    },
    computed: {
        getNow() {
          const today = new Date();
          const date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
          const time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
          const dateTime = date + ' ' + time;
          return dateTime;
        }
    }
})

零件：

methods: {
    getChainAddress(form) {
        if (form.password == form.password_again && form.password != '') {
            console.log(this.getNoW)
        }
    }
}

Answer 1

当您尝试访问时，似乎有一个错字getNow，有一个W而不是一个w。

旁注，

1. 您可以使用模板字符串让生活更轻松

const today = new Date();
const date = `${today.getFullYear()}-${(today.getMonth() + 1)}-${today.getDate()}`;
const time = `${today.getHours()}:${today.getMinutes()}:${today.getSeconds()}`;
const dateTime = `${date} ${time}`;

2. 您可以在语句中翻转您的条件，if因为如果第一个条件为假，JS 将不会评估第二个条件&&

if (form.password != '' && form.password == form.password_again) {
  console.log(this.getNoW)
}

Answer 2

mixin 中的计算属性定义为：getNow()，但你在组件中将其拼写为getNoW()。

要么，要么你可能忘记在组件中包含 mixin。