Question

作为标题，我想为所有道具添加观察者和相同的回调，但我在子组件中编写这样的代码：

＆＃13;

<script>
export default {
  props: {
    a: String,
    b: String,
    c: String
  },
  watch: {
    a (v) { this.handler(v) },
    b (v) { this.handler(v) },
    c (v) { this.handler(v) },
  },
  methods: {
    handler (v) {
      // code...
    }
  }
}
</script>

＆＃13;

你知道如何简化这个吗？

Answer 1

使用函数构建组件。

function buildComponent(properties){
  const base = { methods:{ handler(v){ console.log(v) }}, props:{}, watch:{}}

  for (let prop of properties){
    base.props[prop] = String
    base.watch[prop] = function(v) {this.handler(v)}
  }
  return base
}

export default buildComponent(["a","b","c"])

Vue只是javascript。

在Vuejs中，如何将观察者添加到所有道具并使用相同的函数作为回调？

1 个答案: