vue2.0 仿手机新闻站(一)项目开发流程

vue仿手机新闻站:

1.拿到静态页面,直接用vue边布局,边写
2.假数据
没有用任何UI组件,切图完成

做项目基本流程:

1.规划组件结构

Nav.vue
Header.vue
Home.vue
...

2.编写对应路由

vue-router

3.具体写每一个组件功能


建议:一些公共文件 jquery,jquery插件,一般在index.html文件里面引入

main.js require() / import
vue init webpack-simple news

项目需要的模块:

vuex
vue-router
axios
style-loader
css-loader
npm install vuex vue-router axios style-loader css-loader -D

重新缕缕:

assets -> 静态资源 img,css,js
想在js里面引入css模块:style-loader,css-loader

路由:

new VueRouter({
	routes:路由具体配置
})

watch:{ // 监听,当路由发生变化的时候执行
	$route(){
		alert(1);
	}
}

数据请求

axios 可以配置

axios.interceptors.request.use(); // 发送请求配置

axios.interceptors.response.use(); // 接收请求配置

axios.defaults.header.post['Content-Type'] = 'application/x-www-form-urlencoded'; // 设置post头部信息

.

原文地址:https://www.cnblogs.com/crazycode2/p/7565635.html