vue.js孩子父母组件通信
问题描述:
我想从我的组件调用函数到我的vue进行登录。vue.js孩子父母组件通信
这是我的组件:
Vue.component('auths', {
data: function() {
return {
ip: '',
sessiontoken: ''
}
},
ready: function() {
this.settoken();
this.getip();
},
methods: {
getencrypteduser: function() {},
createauthentification: function(event) {
console.log(moment().format('LLLL'));
var data = {
'_links': {
'type': {
'href': 'http://example.com/rest/type/node/authenfication'
}
},
'title': [{
'value': 'cccccccc'
}],
'field_id': [{
'value': this.$cookie.get('test')
}],
'field_ip': [{
'value': this.ip
}],
'field_va': [{
'value': 'Basic ' + window.btoa(this.user + ':' + this.password)
}],
'field_expiration': [{
'value': '2016-08-01T14:30:00'
}]
}
this.$http.post('http://example.com/entity/node?_format=hal_json', data, function(response) {
console.log(response);
this.$set('success', 'ok');
this.$route.router.go('/');
}, {
headers: {
'Accept': 'json',
'Content-Type': 'application/hal+json',
'Authorization': 'Basic ' + window.btoa(this.user + ':' + this.password),
'X-CSRF-Token': this.sessiontoken
}
}).error(function(response) {
this.$set('message', 'Désolé, nous ne avons pas réussi à vous authentifier. Réessayez.');
this.$set('error', true);
});
this.$cookie.set('test', 'Hello world!', 1);
console.log(this.$cookie.get('test'));
},
settoken: function() {
this.$http.get(apiURL4, function(response) {
this.sessiontoken = response;
console.log(response);
});
},
getip: function() {
this.$http.get(apiURLip, function(response) {
this.ip = response;
console.log(response);
});
}
},
events: {
'createauthOnChild': 'createauthentification'
}
})
,我想使用该事件在这里:
var login = Vue.extend({
template: '#login',
data: function() {
return {}
},
ready: function() {},
methods: {
getauthentifications: function(event) {
this.$http.get('http://example.com/application/authentification', function(response) {
console.log(response);
}, {
headers: {
'Accept': 'json',
'Content-Type': 'application/hal+json',
'Authorization': 'Basic ' + window.btoa(this.user + ':' + this.password)
}
});
this.$on('createauthOnChild');
}
}
})
没有错误或任何东西,但createauthOnChild
不调用createauthentification
功能。谁能告诉我我做错了什么?
答
我不确定以下语法。
events: {
'createauthOnChild': 'createauthentification'
}
当你想调用其他事件的方法,你可以实现一个event bus .Y OU可以使用空Vue的实例作为*事件总线:
var bus = new Vue()
// in component A's method
bus.$emit('id-selected', 1)
// in component B's created hook
bus.$on('id-selected', function (id) {
// ...
})
在较为复杂的情况下,应考虑采用专用state-management pattern。
谢谢你的建议。你有任何关于这个错误的想法http://*.com/questions/41021447/vue-js-error-cannot-read-property-parent-of- undefined – user3423920
@ user3423920将检查,如果你发现解决方案有用你可以放弃并接受答案,这将使这更加可信,并帮助其他用户。 – Saurabh
@Aaron是的,我也在答案中给出了这个参考。 – Saurabh