vue基础命令及webpack创建Vue项目

vue基础命令

v-bind指令

v-bind指令的作用是:为元素绑定属性
完整写法是v-bind:属性名
简写的话可以直接省略v-bind,只保留:属性名

v-for

v-for指令的作用是:根据数据生成列表结构
数组经常和v-for结合使用
语法是(item,index)in 数据
item和index可以结合其他指令一起使用
数组长度的更新会同步到页面上,是响应式的

v-on

传递自定义参数,事件修饰符
文档传送门
链接: 链接.
事件绑定的方法写成函数调用的形式,可以传入自定义参数
定义方法时需要定义形参来接收传入的实参
事件的后面跟上,修饰符可以对事件进行限制
.enter可以限制触发的按键为回车

v-model

获取和设置表单元素的值(双向数据绑定)
v-model指令的作用是便捷的设置和获取表单元素的值
绑定的数据会和表单元素值相关联
绑定的数据表单元素的值

axios

功能强大的网络请求库
链接:
文档传送门:https://github.com/axios/axios
axios必须先导入才可以使用
使用get或post方法即可发送对应的请求

webpack

创建一个webpack项目语法
$ vue init webpack my-project

? Project name vuetest    //项目名称
? Project description A Vue.js project    //项目描述默认回车
? Author                        //作者
? Vue build standalone      //打包方式standalone
? Install vue-router? Yes      //是否创建路由,学习初期暂时不需要
? Use ESLint to lint your code? No       //是否使用ESLint检测你的代码。建议:No
? Pick an ESLint preset Standard
? Set up unit tests Yes      //是否安装单元测试。建议:No
? Pick a test runner jest      
? Setup e2e tests with Nightwatch? Yes   //是否安装E2E测试框架NightWatch(E2E(End To End),就是所谓的“用户真实场景”)。建议:No
? Should we run `npm install` for you after the project has been created? (recommended) npm     //项目创建后是否要为你运行“npm install”?这里按照推荐,选择包管理工具。建议:yes use npm

启动webpack项目语法
npm run dev

猜你喜欢

转载自blog.csdn.net/yang13676084606/article/details/108326265