![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 93
Liuqz2009
不念过去不畏将来,全心活在当下!
二十年寒窗,终抵不过资本的收割,中年危机,失业求捞!
展开
-
HTML、WebStrom和Vue使用
WebStorm配置启动Vue项目用WebStorm运行Vue项目原创 2023-01-10 14:17:56 · 174 阅读 · 0 评论 -
使用Visual Studio Code编写VUE所使用的插件
Auto Close Tag 自动闭合HTML标签Auto Rename Tag 修改HTML标签时,自动修改匹配的标签Bookmarks添加行书签Can I Use HTML5、CSS3、SVG的浏览器兼容性检查Code Runner 运行选中代码段(支持大量语言,包括Node)CodeBing 在VSCode中弹出浏览器并搜索,可编辑搜索引擎Color Highligh...转载 2020-02-21 10:25:47 · 1946 阅读 · 0 评论 -
export 和 module.export 的区别
在浏览器端 js 里面,为了解决各模块变量冲突等问题,往往借助于 js 的闭包把左右模块相关的代码都包装在一个匿名函数里。而 Nodejs 编写模块相当的自由,开发者只需要关注 require,exports,module 等几个变量就足够,而为了保持模块的可读性,很推荐把不同功能的代码块都写成独立模块,减少各模块耦合。每一个node.js执行文件,都自动创建一个module对象,同时,mod...转载 2020-01-20 11:07:50 · 510 阅读 · 0 评论 -
ES6 Module(export与export default)
ES6 Module使用import关键字导入模块,export关键字导出模块ES6 Module是静态的,和var以及function一样具有提升效果ES6 Module自动采用严格模式(顶层的this返回undefined)ES6 Module支持使用export{<变量>}导出具名接口,或export default导出匿名接口export和export defau...转载 2020-01-20 11:01:37 · 253 阅读 · 0 评论 -
2-8 整体配置结构
之前的章节分别讲述了每个配置项的具体含义,但没有描述它们所处的位置和数据结构,下面通过一份代码来描述清楚:const path = require('path');module.exports = { // entry 表示 入口,Webpack 执行构建的第一步将从 Entry 开始,可抽象成输入。 // 类型可以是 string | object | array e...转载 2020-01-20 10:49:37 · 275 阅读 · 0 评论 -
Webpack
1、深入浅出 Webpack2、webpack中文文档v4.41.53、webpack中文文档v4.15.1原创 2020-01-19 16:53:37 · 148 阅读 · 1 评论 -
解读 vue-cli 脚手架(一):npm run dev的背后
揭秘 vue-cli 脚手架前言:记得自己大二(2016年)的时候,经过同学的介绍,偶然间接触到了 vue 的项目。那时候的自己对于这一项新兴的技术掌握程度并不好,一来二去折腾了一个星期,也没有弄明白里面的原理(因为当时从来没有接触过这种脚手架,通过webpack,nodejs打包的项目,思维依旧停留在Bootstrap,JQuery等,传统开发的时代,怎么也转不过来),当时就暗暗发誓,将来一...转载 2020-01-19 09:12:37 · 309 阅读 · 0 评论 -
vue如何新建一个项目(超详细哦)
vue创建项目(npm安装→初始化项目)第一步npm安装首先:先从nodejs.org中下载nodejs图1双击安装,在安装界面一直Next图2图3图4直到Finish完成安装。打开控制命令行程序(CMD),检查是否正常图5使用淘宝NPM 镜像大家都知道国内直接使用npm 的官方镜像是非常慢的,这里推荐使用淘宝 ...转载 2020-01-17 17:04:50 · 361 阅读 · 0 评论 -
Vue 2.0的学习笔记:Vue的过滤器
转自:https://www.w3cplus.com/vue/how-to-create-filters-in-vuejs.html过滤器的介绍1、在Vue中使用过滤器(Filters)来渲染数据是一种很有趣的方式。2、首先我们要知道,Vue中的过滤器不能替代Vue中的methods、computed或者watch,3、过滤器不改变真正的data,而只是改变渲染的结果,并返回过...转载 2020-01-07 20:09:09 · 130 阅读 · 0 评论 -
Vue进阶--01--vm.$scopedSlots和vm.$slots的理解和基本使用
官方定义vm.$slots类型:{[name: string]: ?Array<VNode>}只读详细:用来访问被插槽分发的的内容。每个具名插槽有其相应的属性。default属性包括了所有没有被包含在具名插槽中的节点或v-slot:default的内容在使用渲染函数书写一个组件时,访问vm.slots最有帮助。vm.$scopedSlots类型:{[name:...转载 2020-01-07 11:39:03 · 990 阅读 · 0 评论 -
render 函数(二)
this.$slots 在 render 函数中的应用 <div id="app"> <my-component> <p > 灌篮高手</p> <p >我是要成为海贼王的男人</p> <h1>我是h1</h1>...转载 2020-01-06 20:57:17 · 566 阅读 · 0 评论 -
render函数
render 函数的作用 简单的说,在vue中使用模板HTML语法组建页面,使用render函数可以用js语言来构建DOM 因为vue是虚拟DOM,所以在拿到template模板时也要转译成VNode的函数,而用render函数构建DOM,vue就免去了转译的过程。 当使用render函数描述虚拟DOM时,vue提供一个函数,这个函数是就构建虚拟DOM所需要的工具。官网上...转载 2020-01-06 20:48:19 · 225 阅读 · 0 评论 -
Vue自定义指令详解
可以使用Vue.directive( dir_name , {} ) 来定义全局自定义指令也可以使用 directives{ dir_name : {} } 来定义局部自定义指令钩子函数 : bind 只调用一次,当指令第一次绑定在元素上时. 用来做一次性初始化操作. inserted 当绑定元...原创 2020-01-06 20:01:02 · 647 阅读 · 0 评论 -
关于vue.js里禁用特性继承的理解
最近在跟着官方文档学习vue.js的文章,当看到禁用继承特性这一点的时候不是很理解,后跟着官方的实例运行了一下,算是弄懂了一些,特此记录,仅供参考!首先假设如今有一个组件<base-input></base-input>,创建改组件式的代码如下:Vue.component("base-input", { inheritAttrs: false, //此处设置禁...转载 2020-01-05 11:35:51 · 454 阅读 · 0 评论 -
vuex中mapGetters的使用及简单实现原理
一.项目中的mapGetters在Vue项目的开发过程中必然会使用到vuex,对vue项目公用数据进行管理,从而解决组件之间数据相互通信的问题,如果不使用vuex,那么一些非父子组件之间的数据通信将会变得极为繁琐。1. 这里首先说下项目中mapGetters的使用先看下store部分目录结构index.js文件import Vue from 'vue'import Vuex...转载 2019-12-31 10:51:43 · 1414 阅读 · 0 评论 -
litemall使用vue+shiro实现权限控制及动态路由
整体思路会话开始之初,先初始化一个只有登录路由的Vue实例,在根组件通过 handleLogin() 将路由定向到登录页,再拉取登录框的数据,让每个请求携带token-- [‘X-Litemall-Admin-Token’]实现用户鉴权.然后获取当前用户的权限数据,用户登录成功之后,会在全局钩子router.beforeEach中拦截路由,判断是否已获得token,在获得token之后就要去获...转载 2019-12-27 15:54:58 · 1194 阅读 · 0 评论 -
详解vue2.0中 render: h => h(App)
创建一个vue项目,基本都是用到vue-cli,新建的项目main.js里面会有这么一句代码: new Vue({ render: h => h(App), }).$mount('#app')这个就是创建一个vue对象,然后挂载到制定的页面节点。这里重点说的是 render: h=>h(App) 是啥意思?怎么理解?这个首先要知道ES6的箭头...转载 2019-12-23 14:06:58 · 316 阅读 · 0 评论 -
vue实例的参数说明
vue实例中的参数与选项:el:"#id", //DOM成员(1/3)提供一个在页面上已存在的 DOM 元素作为 Vue 实例的挂载目标。template:"<tag></tag>", //DOM成员(2/3)一个字符串模板作为 Vue 实例的标识使用。模板将会 替换 挂载的元素。挂载元素的内容都将被忽略,除非模板的内容有分发 slotrender: (...转载 2019-10-23 17:34:28 · 1556 阅读 · 0 评论 -
Vue实例中生命周期created和mounted的区别
最近刚好在学习Vue.js,在实敲轮播demo时发现了一个当时感觉很奇怪的问题:初始化使用mounted钩子时,只调用了一次,之后就没有调用过了。害我一直以为是自己之后的代码书写有问题,结果自己再敲一遍还是只能初始化调用一次。。。发现这个问题后找找大神们的博客看了看,发现了created钩子的使用。下面就将这次的经历给记录下来。。。生命周期先上图什么是生命周期Vue实例有一个完整的...转载 2019-10-23 17:32:41 · 217 阅读 · 0 评论 -
Vue.js 你需要知道的 v-slot (译)
面试官:谈谈 v-slot 的作用?自己先想一分钟。这篇文章假设你对组件的基础知识有定义的了解,如果你对此还不熟悉,请先阅读。从 vue@2.6.x 开始,Vue 为具名和范围插槽引入了一个全新的语法,即我们今天要讲的主角:v-slot 指令。目的就是想统一 slot 和 scope-slot 语法,使代码更加规范和清晰。既然有新的语法上位,很明显,slot ...转载 2019-10-22 11:22:51 · 292 阅读 · 0 评论