如何将数据传递给mixin，然后在您的组件中显示它们？

问题描述

我想将数据传递给我的 mixin 方法，然后在我的组件中显示它。类似的东西：

//component A

mixins: [mixinOne],data(){
  return{
    val = null
  }
},mounted(){
  this.mixinMethod('good value',this.val);
}

//mixinOne
mixinMethod(valOne,valTwo) {
  valTwo = valOne;
}

在我的模板中我想显示 val:

// component A
<template>
  {{val}}
</template>

我已经编写了上面的代码，但它不起作用。它为 {{val}} 返回 null！所以基本上我想在我的组件中看到 {{val}} 的“良好价值”，这是通过我的 mixin 设置的。我该怎么做？

解决方法

你应该把你的数据部分放在 mixin 中，然后改变它并在你的组件中呈现它。

// MmixinOne
data () {
  return {
    val = null
  }
},methods: {
  mixinMethod (valOne,valTwo) {
     valTwo = valOne
  }
}

// Component A
<template>
  {{val}}
</template>

<script>
import MmixinOne from './MmixinOne'

export default {
  mixins: [MmixinOne],mounted () {
    this.mixinMethod('good value',this.val)
  }
}
</script>

无论如何，您不需要在“val”上设置值的方法。 你可以直接在mounted中设置你的值：

mounted () {
  this.val = 'good value'
}