Javascript Vue.js在组件外部设置数据

我有一个组件，我想设置一个数据项 组件外部

我将如何使用指令执行此操作

我在想这样的事情：

Vue.directive('init', {
    bind: function(el, binding, vnode) {
        vnode.context[binding.arg] = binding.value;
    }
});

<div id="app">
  <test :initDate="2017-07-20 09:11:42"></test>
</div>

但它不起作用：

Vue.directive（'init'{
绑定：函数（el、绑定、vnode）{
vnode.context[binding.arg]=binding.value；
}
});
Vue.组件（“测试”{
模板：“{{date}
”，
数据（）{
返回{
日期：“”
}
}
});
新Vue({
el:“#应用程序”
})

---

如果我理解正确，您应该使用道具将数据传递到组件。事实上，您只能使用一个变量（date或initDate），用法是相同的

Vue.component('test', {
  template: '<p>{{date}}</p>',
  props:['initDate'],
  data() {
    return {
            date: ""
    }
  }
});

new Vue({
  el: '#app'
});

Vue.component（'test'）{
模板：“{{date}
”，
道具：['initDate']，
数据（）{
返回{
日期：“”
}
}
});
新Vue({
el:“#应用程序”
});

然后在html中，您可以这样使用它：

Vue.directive('init', {
    bind: function(el, binding, vnode) {
        vnode.context[binding.arg] = binding.value;
    }
});

<div id="app">
  <test :initDate="2017-07-20 09:11:42"></test>
</div>

---

您可以使用

$data

引用组件的数据

Vue.directive（'init'{
绑定：函数（el、绑定、vnode）{
vnode.context[binding.arg]=binding.value；
}
});
Vue.directive（'initData'{
绑定：函数（el、绑定、vnode）{
vnode.context.$data[binding.arg]=binding.value；
}
});
新Vue({
el:“#应用程序”，
数据：{
城市：''
},
组成部分：{
城市输入：{
数据（）{
返回{
城市：''
}
}
}
}
})

{{ciudad}
{{ciudad}

这应该行得通

Vue.directive（'init'{
绑定：函数（el、绑定、vnode）{
设组件=标高__
组件[binding.arg]=binding.value
}
});
Vue.组件（“测试”{
模板：“{{date}
”，
数据（）{
返回{
日期：“”
}
}
})
新Vue({
el:“#应用程序”
})

您想将

this.initDate

作为

日期的初始值，对吗？不，我不想为此使用
道具。我有很多文本字段等。。。。你知道我该如何解决这个问题吗？@Jenssen它总是相同的值还是不同的值？您可以设置属性的默认值（即，您不必定义任何内容）。@Agramer否不是。我想将其与
laravelold（'date'）一起使用这是有效的：但他没有使用组件。通过检查
vnode
，它指向根vue。这就是为什么它对你不起作用。请查看下面我的答案以获得解决方案。