Question

我有一个发出AJAX请求的组件。在回调函数中，我想将值传递回父或根实例。

所以我的回调函数例如在组件中是：

function callbackFunc(vm, response){
  vm.$emit('setValue', response.id);
}

在我的根实例中我尝试使用一个名为setValue的方法，如下所示：

export default {
  name: 'app',
  data () {
    return {
      value : ''
    }
  },
  methods: {
    setValue: function(value){
      console.log(value);
    }
  }
}

这不起作用。文档似乎说你需要在模板中有一个事件，以便它可以被连接起来但在这种情况下不会起作用。

有什么想法吗？

干杯！

Answer 1

我正在使用vue-router。所以有一个带有App的根元素组件，然后有一个名为Hello的组件 ajax电话

在父组件的模板中，您将拥有一个<router-view><\router-view>，这是vue-router将您孩子放置的位置。要连接所有内容，您需要将指令添加到模板中：

<router-view v-on:setValue="parentMethod" ><\router-view>

当孩子在ajax调用之后调用$emit("setValue")时，它将在父级上触发parentMethod()。目前尚不清楚为什么你说它不能在模板中连接起来。没有模板，就没有真正的父/子关系。

Vue.js 2将数据从组件传递到根实例

1 个答案: