vue总结

alt

模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>初识Vue</title>
    <!--引入Vue-->
    <script type="text/javascript" src="../js/vue.js">注意检查这里的路径../</script>
</head>
<body>


    <!--设置不提示-->
    <script type="text/javascript" >
      Vue.config.productionTip = false;		
		
      const vm = new Vue({
			
        })
      vm.$mount('#')
    </script>
</body>
</html>

插值语法:标签体内容、指令语法

alt

alt

单向数据绑定、双向数据绑定

alt

    <div id="test01">
        单向数据绑定 :<input type="text" :value="name1">
        双向数据绑定 :<input type="text" v-model="name2">
    </div>

用户代码片段简写 el和data的两种写法

  • el绑定模板 :v.$mount('#test01')
  • data:函数式(推荐),由Vue管理的函数,一定不要写箭头函数,写了this就不是指定Vue实例了
const v = new Vue({
   data(){
       return{
             name1:'张三'
       }
	}
 })
// 绑定模板
v.$mount('#test01')

MVVM

  • M :模型(Model)==> 对应data中的数据
  • V :视图(View ) ==> 模版
  • VM :视图(模 型)==> Vue实例对象

数据代理:通过一个对象代理对另一个对象中属性的操作(getter、setter)

alt

alt

数据代理的应用

alt

事件处理

全部评论

相关推荐

2025-12-28 22:19
门头沟学院 Java
不敢追165女神:简历写得毫无特点,你说你要是大二或者大三找寒假实习到暑期实习这段时间,你的简历还能约到面试。但是你是研究生哥,面试官不会因为你是研究生而降低要求,反而会觉得你是研究生才学了这么一点?为什么我不找个同阶段的本科生?
简历中的项目经历要怎么写
点赞 评论 收藏
分享
评论
点赞
收藏
分享

创作者周榜

更多
牛客网
牛客网在线编程
牛客网题解
牛客企业服务