子实例中的Vue.js数据

时间:2016-12-08 12:43:28

标签: vue.js

如何在Vue.js中的子实例中包含success:function(output, input, response) { console.log(output); // alert(output.request.number); THIS THE VALUE I NEED var responseText = null; var outputTest = {}; outputTest = output.request.number; var latestResponse = Api.getResponsePayload(); responseText = 'The value is: ' + outputTest); 选项?

data

此处<html> <body> {{ foo }} <script> var root = new Vue({ el: 'body' }); var child = new Vue({ parent: root, data: function() { foo: 'bar' } }); </script> </body> </html> 没有打印任何内容。但是如果我在根实例中添加body变量,它就会被打印出来。如何使数据选项适用于子实例?

1 个答案:

答案 0 :(得分:2)

以下语法是在子vue实例中具有data属性:

const Foo = { 
    data: function () {
    return {
        foo: "I am Foo"
      }
    },
    template: '<div>foo: {{foo}}</div>' 
}

并且您只能在子实例的模板中使用此数据属性。您可以在此fiddle中看到整个工作演示。

使用JS代码可以找到另一种创建vue组件并使用它的样式here

Vue.component('child', {
  data () {
    return {
      foo: 'bar'
     }
  },
  template: '#foo'
});

var vm = new Vue({
  el: '#root'
});