Vue依赖注入(provide/inject)
最近在看element-ui
的源码,发现了一个这样的属性:inject
。
provider/inject
:简单的来说就是在父组件中通过provider
来注入,然后在子组件中通过inject
来引用。这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。
最近在看element-ui
的源码,发现了一个这样的属性:inject
。
provider/inject
:简单的来说就是在父组件中通过provider
来注入,然后在子组件中通过inject
来引用。这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。
在页面源文件index.html
的标签之间插入
<link rel="shortcut icon" href=" /favicon.ico" />
仍旧无法加载图标
HtmlWebpackPlugin
插件中加入小图标,Vue
脚手架时修改webpack.dev.conf.js
配置文件:
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
favicon: './favicon.ico', // 添加小图标
inject: true
}),
不要忘记webpack.prod.conf.js
中也需要添加
注:( favicon.ico
放入根目录。)
有些时候,用户可能会重复请求数据,造成不必要的浪费,所以很有必要拦截重复的请求。
近几年web应用的发展可以用疯狂来形容,依靠浏览器的支持以及前端技术和框架的发展,很多应用已经把大量的逻辑从服务器端迁移到了浏览器端,使用前后端分离技术,浏览器端与用户进行交互来完成复杂的逻辑。由于这个发展趋势,Web应用的前端代码的复杂度大大提高,尤其是 JavaScript 和 CSS 代码的数量大幅增加,面对空前庞大的css和js代码量,形成科学的代码组织方法和命名规范迫在眉睫。
Vue CLI3出了有一段时间了,但是项目上面还是用的Vue CLI2,最近看到小伙伴在研究,于是抽了一个下午加晚上的时间,把vue.config.js
这块配置好。项目中用的是Sass,希望是公共的样式提取到一个scss文件中,页面单独的样式就写在vue里面,这样后期维护比较方便。
Vue Router传参基本上是必备知识点,总结一下。
组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用。那么组件间如何通信,也就成为了vue中重点知识了。这篇文章将会通过props
、$ref
和 $emit
这几个知识点,来讲解如何实现父子组件间通信。
在vue中,使用watch
来响应数据的变化,watch
的用法大致有三种: