2018-10 -23
一、由于时间过了好久的缘故,Vue的好多知识都已经日渐模糊了,所以,我们先一起来复习一下Vue。
1.vue的简介;
三大主流框架:vue/angular/react
。
2.vue的概念;
3.过滤器;
4.vue的计算属性 ;
处理复杂的逻辑操作;
5.vue的组件;
扩展html元素,封装可重用代码。
6.vue的组件中传值;
7.生命周期和路由(路由的嵌套,路由的传参);
8.vue中的ajax(axios)。
二、coding在Git中:
①先输入git init;
②git add .;
③git commit -m "项目";
④git remote add origin https://git .coding.net./QAQming/robot.git;
⑤gIt push -u origin master。
QAQ
:在没有index链接 后+"/文件名.html"
QAQ
:安装“淘宝镜像”(cnpm)==>这样可以快速的执行其他指令了。
eg:npm install -g cnpm -registry=https://registry.npm.taobao.org
QAQ
:在Git中不能用“ctrl+c”或者“ctrl+v”来复制粘贴。且ctrl+c在Git中为结束上一步指令。
三、vue-cli脚手架(搭建项目结构)
1.xxx.vue==>单文件组件。
<template>
html
</template>
<style>
css
</style>
<script>
js
</script>
3.也就是重中之重了:利用webpack做vue-cli。
①webpack(对代码进行压缩)
cnpm install webpack -g
②vue-cli
cnpm install vue-cli -g
③搭建一个项目(webpack模板)
vue init webpack webpack-demo
QAQ
:webpack-demo为项目名称。
QAQ
:且注意安装相关依赖之前其是否在项目文件夹中,若不在,在Git中
cd 项目名 ,让其进入文件夹。
④安装相关依赖(安装node_modules文件夹)
cnpm install
⑤开启一个服务
npm run dev
QAQ
:在vue-cli中:
1.网站的公共样式放到App.vue中
;
2.在router中的index.js中配置路由
;
3.在components中创建xxx.vue,写
<template>
html
切记在写html时必须要有一个最大的盒子(div)来包裹
。
</template>
<style>
css
</style>
<script>
js
</script>
4.在static中创建css,images,······
在static中的css中放的是通用样式,然后链接到index.html
images中放的就是你所需要的图片了,且注意他的路径是相对还是绝对的
。