- 博客(8)
- 收藏
- 关注
RSS订阅原创 Vue CLI
Vue CLI 21、 安装脚手架2（安装两个版本使用时可以选择）npm install @vue/cli-init -g //本机命令提示符安装2、脚手架初始化项目vue init webpack XX(项目名称) //集成终端运行3、选择配置4、脚手架打包完成后目录解析Vue CLI 3/41、安装脚手架插件 (-g 全局安装)cnpm install @vue/cli -g //本机命令提示符安装 cnpm为淘宝镜像安装2、脚手架初始化项目...
2021-06-16 21:04:23
111
原创 webpack配置VUE
runtime-only/compiler版本vue构建了两类版本：区别在于打包中的main.js文件 runtime-compiler:代码中，可以有template，compiler会编译template template->ast->render->vdom->UI new Vue({ el:'#app', template:<App/>, //使用 components:{App}}) //注册 runtime-...
2021-06-16 21:03:35
128
原创 webpack的loader
css-loader/style-loader打包css文件1、在main.js中依赖css文件import { num,answer } from "./src/js/1.js";console.log(num);console.log(answer);***require('./src/css/normal.css')2、在集成终端下载：npm install --save-dev css-loader和npm install style-loader --save-dev
2021-06-16 21:02:44
84
原创 webpack打包
css-loader/style-loader打包css文件1、在main.js中依赖css文件import { num,answer } from "./src/js/1.js";console.log(num);console.log(answer);***require('./src/css/normal.css')2、在集成终端下载：npm install --save-dev css-loader和npm install style-loader --save-dev
2021-06-16 21:02:00
81
原创 条件判断v-if
条件判断v-if根据表达值的真假，切换元素的显示和隐藏原理：操纵DOM元素，true存在于DOM树中，false不存在<h2 v-if='isShow'>12344</h2> el:'#app',data:{isShow:true} //true显示12344 false不显示v-else为true时显示内容，为false显示其他内容，在其他内容处加v-else<h2 v-if='isShow'>12344</h2>..
2021-06-14 23:41:42
523
原创 v-for遍历
v-for 遍历数组 根据数据生成列表结构，数组与v-for结合使用，数组长度更新会同步到页面上，响应式 <ul> <li v-for='(item,index) in arr'>{{index}}.{{item}}</li></ul> 遍历对象 遍历时如果只获取一个值，则获取到的是value <li v-for='item in info'>{{item}}</li>el:...
2021-06-14 23:40:42
505
1
原创 v-model获取和设置表单元素的值
获取和设置表单元素的值，双向数据绑定原理：语法糖，包含两个操作v-bind和v-on <input type="text" v-model="message"> {{message}}</div><script> const app = new Vue({ el: '#app', data: {message: '你好啊'}} //message任一一个改变，其余均会变 结合radio选择性别 <div id="a...
2021-06-14 23:39:30
1094
1
原创 v-on元素绑定事件
v-on为元素绑定事件，@简写，绑定的方法在methods属性中 参数传递问题 1、如果函数需要参数，但是没有传入dolt()，函数的形参为undefined; @click='dolt()methods:{dolt(num){ console.log(num)}//undefined 2、如果函数需要参数，但省略了()，写为dolt，Vue会默认将浏览器生成的event事件(鼠标事件的数据)作为参数传入到方法 @click='dolt'methods:{dolt(..
2021-06-14 23:37:05
170
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人