创建一个完整的脚手架步骤:

1.先做页面的html 以及css   

html打好注释,方便查看

css具体到从那个标签开始(注意区分段)

2.在外部资源管理器中,cmd

使用  vue create 项目名

↓第三个选项   y   n  选择packge.json

$ cd cli-phone

$ npm run serve

进入到浏览器查看自己建的项目

3.把做好的页面放入到components 区分html注释部分  头部 身体 尾部

样式分别添加进去    公共样式放到app.vue中

4.在view下面的文件夹中home.vue更改引入,把需要的组件引入

5.完成逻辑代码  子传父   子组件创建$emit   (自定义事件名,参数)   

父组件的模板中使用@自定义事件名

父传子   在子组件中使用props   父组件直接:v-bind使用  子组件中需要调用接口和watch监听

6.接口跨域  需要在src下面文件夹创建http 下面创建api.js

需要在子组件中引入 api.js      import {get} from '@/http/api.js'

还需要创建vue.config.js

里面代码如下:

module.exports = {

devServer: {

proxy: 'http://v.juhe.cn/todayOnhistory'

}

}

在这之前需要安装axios

代码为:npm i axios -S

具体内容代码如下:import axios from "axios"

export const get = (url) => {

return new Promise((resolve, reject) => {

axios.get(url).then(res => {

resolve(res.data)

}).catch(err => {

reject(err.data)

})

})

}

7.更改配置  跨域后  需要重启一下项目  npm run serve

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容