Vue 环境搭建及安装vue.js和创建项目
一.node.js
1.安装node.js 链接: (https://nodejs.org)
安装好后,打开命令行窗口(cmd)
输入node -v npm -v 查看版本号
二.安装vue
1.淘宝镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
tip:没有网络下载时,会提示‘vue’不是内部文件啥的
2.安装vue脚手架
. npm install -g @vue/cli
.安装好后 vue -V 查看版本号
三.创建项目
1.vue create 项目名称
选择配置信息
1.选择Manually select features 自定义配置
2.按空格选择资源配置
choose vue version
babel
router
vuex
css
3.选择版本(vue2)
4.选择路由模式 n(不选)
5.选择css预处理 less
(解决浏览器兼容,代码简化问题)
6.如和存放配置选择package.json
7.是否本地本地配置 y(选择保存)
iView ui框架
npm 安装
npm install iview --save
引入 main.js中
import iView from 'iview';
import 'iview/dist/styles/iview.css';
Vue.use(iView);
vue进入axios
安装命令
npm install axios --save
npm install vue-axios --save
package.json 查看版本
main.js 引入
1.import axios from 'axios';
2.import VueAxios from 'vue-axios';
3.Vue.use(VueAxios, axios);
初始化方法
home.vue
methods:{
getList(){
this.axios.get('http://localhost:3312/user/getList',{
params:{
page:this.query.page,
size:this.query.size,
name:this.query.name,
phone:this.query.phone,
city:this.query.city
}
}),then((res)=>{
console.log(res)
this.tableData = res.data.content.list
this.total=res.data.content.total
})
}
}
存在跨域问题,后端解决的