vue

https://www.bilibili.com/video/av74128420/?p=3&t=539

父子组件之间互相传值

image.png

watch

image.png

onhashchange

以#开头的网址不会发送到服务器上去,但是当他们改变的时候,会触发onhashchange事件


image.png

router

image.png

创建router对象


image.png
image.png

新写法

image.png

动态参数

image.png
image.png

组件通信

image.png

全局守卫

https://router.vuejs.org/zh/guide/advanced/navigation-guards.html#%E5%85%A8%E5%B1%80%E5%89%8D%E7%BD%AE%E5%AE%88%E5%8D%AB

axios

image.png
image.png
image.png

webpack

添加选项


image.png

修改前,和修改后


image.png

基本顺序


image.png

添加img


image.png

添加img的loader


image.png
  • 小于limit的图片 会用base64编译一下,只加载一次

将图片转换为base64编码最常见的应用就是在将网页中的一些图片转为base64编码可以实现网页图片在网速 不好的时候先于内容加载和减少http的请求次数来减少网站服务器的负担。

image.png

webpack dev server

image.png

babel 转换新到老

image.png

vue-template-compiler

image.png

vue-cli

image.png
image.png

引入mint-ui
先进入mint-ui的官网,npm install 之后,修改main.js 引入mint-ui的所有部件


image.png
  1. 第一步更新header 顶部栏
image.png
  1. 底部

加了fixed固定在底部和顶部,不是很好用


image.png

image.png

注册全局过滤器

image.png
image.png

vuex

上面是逐个写,下面用了mapstate的形式 ,在使用时直接用{{countAlisa}}的形式就可以


image.png

你可能感兴趣的:(vue)