vue cli的使用(日常使用)

在使用组件的时候, template中只能有个 div嵌套,

• 引入一个文件时, 如果里面是index.js, 可以省略不写,默认会找到这个路径
• 使用src动态引入图片时 , 路径需要使用import或者require引入

---

pop(); 是删除元素的最后一个值,为出栈; push()入栈

props:用于一些数据的复用;

computed:{}, watch:{};

v-bind 属性绑定,v-on:事件绑定

数据的复用;以及加上 key值使其不被复用; 或者v-model
对于数据的监听,需要现在data中声明;不然无法监听到;
展开运算符...
render 函数,

v-show 与v-if
v-show:是display:none;
v-if 是决定标签是否渲染;

filter/map/reduce;
get(){};
字面量的增强写法; 属性,函数;
…
toFixed(2),保留两位小数;

event事件在页面中的相应;
与Vue实例的中之间如何进行交互;

组件

#父子通信;
##父组件转到子组件; props;[" "]; (这里不支持驼峰命名) 可以使用- 分割
##子组件向父组件: 通过事件($emit自定义事件)

---

访问子父的中的数据;(这里的数据指的是什么数据呢)
$children/ $refs 来进行访问;

$ parent/ $root

#组件的复用魔改
slot

###思考组件中的data(){} 为什么写成函数的形式

vue ui 创建本地管理界面,

箭头函数只有一个参数,括号可以省略,

只有一行代码的时候,return以及{},都可以省略;

name => name*name

箭头函数的this指向:
找到最近一层作用域中右this指向的对象;

route, routes,router 的区别;

没有加 \ 转义

this.$router.push();this.$router.replace();

---

this.$route.query.value

return this.$route.params.id  

$route 当前处于活跃的路由
与$router, router的实例对象;

replace点击后没有返回可选;

v-bind用于绑定数据的实现 :to ,此时可以绑定的属性

v-bind绑定属性, von 绑定事件;

v-mdoel  双向数据绑定(可由v-bind  与v-on 实现)

动态路由:的实现

通过children来实现路由的嵌套;
{path:’’, redirect:""},实现默认路径

生成文件夹的目录树: tree /f > list.txt

---

–save-dev和–save的区别

上面的这些依赖有些只在开发环境里面使用的模块，有的在项目上线之后还是要继续依赖的模块。他们之间的区别就在于我们平时安装模块依赖时的：–save-dev和 --save

当你使用–save-dev安装依赖的时候就会放在package.json的devDependencies对象下面，相反的，当你使用–save安装依赖的时候就会出现在dependencies对象下面。

**

总结： –save-dev 是你开发时候依赖的东西，–save 是你发布之后还依赖的东西。

**

---

使用插槽的时候,如果需要设置样式,最好在外层嵌套一个div,这样的样式不会被替换掉

computed 与methods 的区别,哪里该用什么;

---

import 的路径与 src 使用路径别名的时的区别, 前面直接就可以使用,而src需要加上~

Vuex :公共的状态管理工具,是一个响应式的数据结构
分为:state, getters, mutations ,/ actions, models

<keep-aline></keep-aline>的使用,

---

跨域问题???

使用了export ,若没有使用default的话导入的时候需要加入 import {函数名字} from xxx

回调函数的练习

---

达到一定距离,具有粘性的的效果;

div{
	position:sticky;
	top:44px;
}

---

this.goodsList[type].page

Math.random.toString(16).substring(2)
JSON.stringify(Math.random().toString(36).substring(2));

---

ref的作用; 组件与直接在div的使用相当于一个id,但在不同组件中不会相互干扰;

overflow-y:scoll;

---

如果要监听组件的点击,需要添加.native;
@click.native=“tempClick”

---

使用驼峰的时候: probeType, 在监听属性的时候需要变成probe-type:
模板template同理是这样,不过可以直接写

---

对于涉及非父子组件通信时,可以使用$bus.$emit()发射,再用$bus.$on()监听(这里需要使用到js的原型在在原型中new 一个新的Vue实例对象),或者使用Vuex公共状态管理工具

---

防抖与节流

debounce

---

所有的组件中都有一个$el: 可以获取组件的中的元素;

---

在开发中由于图片的加载,存在问题,所以,需要使用@load="",获取更加准确的值;

---

函数return的用法,什么时候需要用return,什么时候不用;

---

路由跳转的传递参数可以用两者方法: 1.使用动态路由的方法;使用/:id 传递
2.使用query来传递;

this.$route.push('/detail/'+this.id)

---

exclude在keep-alive的中的使用;

---

把从服务器获取的数据封装到一个class对象里面,同时利用constructor来对对象封装好,
在从中取出来使用;

---

continue 与break 带标签的使用

---

Object.key(obj).length===0, 可以来判断一个对象是否为空

---

传值需要注意的是;
props:{
}

---

对于数据的封装,需要像组件一样去思考,变成一个模块,再去一个对象中调用

目前存在的问题:
Vue使用的思想精髓还没有领悟,
2.js的高级函数的思想,还是没有掌握;

还是对于数据的处理的问题;怎样才能让其变成一个组织化的方式

问题(question):
1.多个跨域文件如何操作;
2.对于信息的处理;json返回的数据的处理思想,以及Vue开发的思想;

主要还是对于开发的组件思想;
前端始终是对数据的视图处理,思想还是编程的思想,理解如何处理好以及协调好数据才是前端需要干的;

keep-alive 中的生命周期函数, activated(){} 与 deactivated(){}

---

10/28

多看看官方的文档:

• Vue.js
• vue-router
• vuex

by:$/ZH-TX/$