返回信息流下面的代码:
<div>
<p>我的好友</p>
<ul id="myFriendApplyList">
<li is="friendApplyList-apply"
v-for="friendApply in friendApplyList"
v-bind:apply="friendApply"
>
</li>
</ul>
</div>
var friendUl = new Vue({
el: '#myFriendApplyList',
data: {
friendApplyList: null
},
methods: {
approveFriendApply: function (userid) {
alert(userid);
}
}
})
Vue.component('friendApplyList-apply', {
template: '\
<li>\
{{ apply.id }}, {{apply.username}}\
<button v-on:click="approveFriendApply(2)">批准</button>\
</li>\
',
props: ['apply']
})
$(document).ready(function () {
$.ajax({
type: "GET",
contentType: "application/json",
url: "/friend/getMyFriends",
data: null,
dataType: "json",
success: function (data) {
friendUl.friendApplyList = data;
console.log("success: ", data);
},
error: function (e) {
console.log("error: ", e);
},
done: function (e) {
console.log("done");
}
});
});
现在的问题是,点击“批准”按钮,会报如下错误:
[Vue warn]: Property or method "approveFriendApply" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.
(found in component <friendApplyList-apply>)
warn @ vue.js:525
warnNonPresent @ vue.js:1443
has @ vue.js:1475
click @ VM343:2
invoker @ vue.js:1948
Uncaught TypeError: approveFriendApply is not a function
at click (eval at makeFunction (vue.js:8480), <anonymous>:2:157)
at HTMLButtonElement.invoker (vue.js:1948)
请问这是什么问题啊?初次接触vue.js不太熟悉。
这是一条镜像帖。来源:北邮人论坛 / www-technology / #39615同步于 2017/2/23
该镜像源已超过 30 天没有更新,可能在源站已被删除。
WWWTechnology机器人发帖
Vue.js的按钮绑定事件的问题
wislov
2017/2/23镜像同步2 回复
订阅后,新回复会通过你的通知中心匿名送达。