<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="components-demo">
<text-document
v-bind:title="doc.title"
v-on:update:title="doc.title = $event"
></text-document>
上头语句等价下面语句
<text-document v-bind:title.sync="doc.title"></text-document>
</div>
<script>
Vue.component('text-document', {
props: ['title'],
template: `
<div>
<input type="text" @input="$emit('update:title', $event.target.value)">
{{title}}
</div>
`
})
new Vue({
el: '#components-demo',
data: {
doc:{title:'title1'}
},methods:{
receive(item){
console.log(item)
}
}
})
</script>
</body>
</html>
.sync Modifier
最新推荐文章于 2023-05-21 02:57:55 发布
509
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
