用Vue实现双向绑定的小案例。
**双向绑定:**使用了双向绑定的两个内容一定是完全一样,同时变化(同增同减)
效果图
原始样式
删除输入框内容上面显示的文本内容随之减少
在下面输入框输入内容上面显示的内容也会增加
**注意:**在你写代码之前一定要引入Vue.js架包
代码演示
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title><script src="js/vue.js"></script></head><body><div id="show"><p>{{message}}</p><input v-model="message" /></div></body><script>new Vue({el: '#show',data:{message: 'Hello Vue'}})</script>
</html>
扫一扫关注我的公众号获取更多资讯呦!!!