做选择的网站,网页设计期末作品代码,做化妆品网站的原因,wordpress在线查询系统vue是一个用于构建用户界面的渐进是框架
优点#xff0c;大大提高开发效率
缺点#xff0c;需要记忆语法规则
构建用户界面
创建vue实例#xff0c;初始化渲染
1#xff1a;准备容启
2#xff1a;引包#xff0c;开发版本和生产版本
3.创建vue实例 new Vue#x…vue是一个用于构建用户界面的渐进是框架
优点大大提高开发效率
缺点需要记忆语法规则
构建用户界面
创建vue实例初始化渲染
1准备容启
2引包开发版本和生产版本
3.创建vue实例 new Vue
4.指定配置项渲染容器
1el 指定挂载点 2data提供数据
插值表达式
插值表达式是一种vue的模板语法
1。作用利用表达式进行插值并渲染到界面上
表达式是可以被求值的代码js引擎会将其计算出一个结果
2.语法{{}}
3.注意点1使用的数据必须存在data
支持的是表达式并非语句
不能在标签语句中使用{{}}插值
{{XX.toUpperCase()}}
{{或者拼接字符串}}
{{三元逻辑计算符}}
结论如果得出结果的都可以写入
不能直接写入标签的属性值
vue 响应式处理
数据变化试图自动更新
安装vue开发者工具
vue指令
根据不同的指令实现不同的功能
带有v-xx的标签
v-html解析标签内容
v-show 控制元素隐藏
v-show “true” 控制底层的css场景频繁的切换
v-if控制元素显示隐藏条件渲染根据逻辑判断加载语句和移除 不频繁的切换
v-else if v -else 配合if一起使用
v-on监听事件的 注册事件添加事件的监听提供逻辑处理
语法v-on事件名“内联语句”
v-on事件名 “method中的函数名” v-on可替换为
事件名加方法函数名
v-on调用传参 fnab
动态设置src路径 把内容写在标签里用bind
简写属性名 表达式
V-for 多次渲染整个元素
v-for(item,index) in list {{item}}
语法key属性唯一标识
v-for,会尝试原地修改元素就地复用
key作用: 给元素添加的唯一标识便于Vue进行列表项的正确排序复用。注意点: 1.key 的值只能是字符串 或 数字类型 2.key 的值必须具有 唯一性 3.推荐使用 id 作为 key(唯一)不推荐使用 index 作为 key(会变化不对应)
v-model 给表单元素使用进行双向数据绑定可以快速获取 设置 单元表格内容
Vue 指令 v-model 1.作用:给 表单元素 使用双向数据绑定可以快速 获取 或 设置 表单元素内容 0据变化视图自动更新 2视图变化数据自动更新 2.语法: v-model变量
