vue
文章平均质量分 93
Delicia_Lani
这个作者很懒,什么都没留下…
展开
-
JavaScript重要知识点
从今天开始,记录学习过的重要知识点。1.JavaScript 数据类型和数据结构console.log(1 + null);console.log(1 + undefined);原创 2021-12-05 14:51:38 · 1135 阅读 · 0 评论 -
Vue相关题目(部分含Vue源码及解析)
vue的修饰符1.事件修饰符prevent 阻止默认事件(在指定的事件后进行默认事件的阻止) stop阻止事件冒泡(在指定事件后阻止事件冒泡,阻止指定在最内层事件的标签里) self (控制事件操作对象是自己本身的时候才起作用) capture 捕获事件,它会改变事件冒泡的执行顺序 (先外后内) once 控制元素指定的事件只执行一次2.表单元素修饰符number能够强制的指定表单元素的内容数据类型是number trim能够去除输入内容左右两边的空格 lazy只有标签的chang原创 2021-07-10 20:23:42 · 1679 阅读 · 0 评论 -
vue依赖收集
Vue 会把普通对象变成响应式对象,响应式对象 getter 相关的逻辑就是做依赖收集,这一节我们来详细分析这个过程DepDep 是整个 getter 依赖收集的核心,它的定义在 src/core/observer/dep.js 中import type Watcher from './watcher'import { remove } from '../util/index'let uid = 0/** * A dep is an observable that can have转载 2021-07-11 22:26:41 · 2194 阅读 · 0 评论 -
Hicharts实现世界地图思路及踩过的坑(含中文GeoJSON数据集及详细代码)
引入High charts的方案:https://www.highcharts.com.cn/docs/install-from-npm数据集:https://img.hcharts.cn/mapdata/开始使用Highmaps:开始实现地图的官方文档:https://www.highcharts.com.cn/docs/highmaps-started地图数据集字段解析:https://www.highcharts.com.cn/docs/mapdata/ECharts实现地图Demo:原创 2021-06-30 15:01:05 · 4937 阅读 · 0 评论 -
vue性能优化
目录一、Vue 代码层面的优化1.1、v-if 和 v-show 区分使用场景1.2、computed 和 watch 区分使用场景1.3、v-for 遍历必须为 item 添加 key,且避免同时使用 v-if1.4、长列表性能优化1.5、事件的销毁1.6、图片资源懒加载1.7、路由懒加载1.8、第三方插件的按需引入1.9、优化无限列表性能1....转载 2019-11-21 21:24:51 · 435 阅读 · 0 评论 -
vue - minix混入
vue中混入是是实现类继承的重要方式。混入的规则实例minix.jsexport default { data () { return { name: 'minix', minixName: 'minixObj', flag: false, obj: { ...转载 2019-10-29 21:03:10 · 410 阅读 · 0 评论 -
vue自定义指令
在Vue中自定义指令:insertedbind指令的简写形式inserted:inserted主要涉及和行为相关的指令, 来看这个界面:现在我们想自定义一个指令v-focus,使得每次进入页面时,我们的光标都停在search的输入栏。为了实现这个功能,可以定义全局指令,代码如下:Vue.directive('focus',{ inserted:functi...转载 2019-10-29 20:22:06 · 243 阅读 · 0 评论 -
单页面应用路由实现原理:以 React-Router 为例
前言2 年前我刚接触 react-router,觉得这玩意儿很神奇,只定义几个 Route 和 Link,就可以控制整个 React 应用的路由。不过那时候只想着怎么用它,也写过 2 篇与之相关的文章#17#73(现在看来,那时候的文章写得实在是太差了)今天,我们来认真研究一番,希望能解决以下 3 个问题。单页面应用路由的实现原理是什么? react-router 是如何跟 rea...转载 2019-10-28 21:10:41 · 460 阅读 · 0 评论 -
data-v-6542a5cf中的hash值是如何生成的(算法/过程)
目录Scoped CSS#混用本地和全局样式#子组件的根元素#深度作用选择器#动态生成的内容#还有一些要留意Scoped CSS当<style>标签有scoped属性时,它的 CSS 只作用于当前组件中的元素。这类似于 Shadow DOM 中的样式封装。它有一些注意事项,但不需要任何 polyfill。它通过使用 PostCSS 来实现以...转载 2019-10-28 19:38:30 · 1216 阅读 · 0 评论 -
vue源码解读
一、FlowFlow作为静态类型的检查方式非常有利于大型项目源码的开发和维护;类似的工具还有TypeScript。二、new Vue发生了什么原创 2019-10-25 15:26:55 · 150 阅读 · 0 评论 -
Vue相关知识点
目录1.vue生命周期2.v-if与v-show的区别3.Vue的双向数据绑定原理是什么?4.vue与react的异同点:5.watch与computed的区别vue中Key的作用:https://www.jianshu.com/p/a634eb3c19c2单页应用和多页应用:https://www.jianshu.com/p/4c9c29967dd6 vue中re...原创 2019-08-01 11:02:52 · 653 阅读 · 0 评论 -
经典项目中遇到及vue相关知识点
1.Vue相关点:https://blog.csdn.net/qq_29918313/article/details/980392312.vue项目全局loading加载动画:https://blog.csdn.net/qq_29918313/article/details/908988993.vue+echarts实现图表:https://blog.csdn.net/qq_2991831...原创 2019-10-04 07:53:00 · 758 阅读 · 0 评论 -
vue单页面应用和多页面应用
多页应用每一次页面跳转的时候,后台服务器都会给返回一个新的html文档,这种类型的网站也就是多页网站,也叫做多页应用。多页应用为什么多页应用的首屏时间快?首屏时间叫做页面首个屏幕的内容展现的时间,当我们访问页面的时候,服务器返回一个html,页面就会展示出来,这个过程只经历了一个HTTP请求,所以页面展示的速度非常快。为什么搜索引擎优化效果好(SEO)?搜索引...转载 2019-10-09 11:17:28 · 3152 阅读 · 0 评论 -
vue首页白屏的原因及如何优化
一、原因:单页面应用的 html 是靠 js 生成,因为首屏需要加载很大的js文件(app.js vendor.js),所以当网速差的时候会产生一定程度的白屏二、解决办法:(1)优化 webpack 减少模块打包体积,code-split 按需加载(2)服务端渲染,在服务端事先拼装好首页所需的 html(3)首页加 loading 或 骨架屏 (仅仅是优化体验)(4)缓存一...原创 2019-10-09 12:39:10 · 4580 阅读 · 0 评论 -
vue中nextTick
如果在数据改变之后立即调用 Vue.nextTick(callback) ,则回调函数 callback 会在 DOM 更新之后立即调用Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下。其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick。一、示例先来一个示例了解下关于Vue中的DOM更新以及...转载 2019-10-09 18:53:40 · 116 阅读 · 0 评论 -
Vue-router 中hash模式和history模式的区别
实际上存在三种模式: Hash: 使用URL的hash值来作为路由。支持所有浏览器。 History: 以来HTML5 History API 和服务器配置。参考官网中HTML5 History模式 Abstract: 支持所有javascript运行模式。如果发现没有浏览器的API,路由会自动强制进入这个模式。Vue-router 中hash模式和history模式的关系...转载 2019-10-09 22:02:19 · 146 阅读 · 0 评论 -
Vue-封装-$on $emit $off(封装事件订阅)
1.$on 事件的订阅$on(eventName,callback)参数1:事件名称参数2:事件函数判断当前事件名称是否存在,如果不存在则创建一个key值为事件名称value为一个数组 将callback push到数组中consteventList = {};const$on= (eventName,callback)=>{if(!eventL...转载 2019-10-11 18:58:00 · 181 阅读 · 0 评论 -
Vue的computed和watch的细节全面分析
1.computed1.1 定义是一个计算属性,类似于过滤器,对绑定到view的数据进行处理1.2 get用法 data: { firstName: 'Foo', lastName: 'Bar' }, computed: { fullName: function () { return this.firstName + ' ' + t...转载 2019-10-11 19:00:55 · 191 阅读 · 0 评论 -
使用Vue+TS自定义组件时,报did you register the component correctly? ……
在使用Vue+TypeScript封装组件的过程中,报错如下,本以为是TS使用不当的问题,搜了好多帖子,也有小伙伴遇到相同问题,发现,其实都是在代码编写过程中,不够认真导致。我的问题出在哪里,名称不一致所致,如图所示:因为我在这之前使用了其他的命名,最终运行的时候忘记改成统一名字。看到一个帖子中,报错原因是在使用components导入的时候,写成了component;另外,...原创 2019-07-10 15:38:03 · 1038 阅读 · 0 评论 -
Vue+TypeScript入门学习,含详细项目代码,vuex状态管理
之所以写下这篇文章,是因为最近的项目需求,使用Vue,TypeScript实现项目,对我而言,是一个全新的挑战,因此,是零基础,不过各语言之间都是相通的,学起来也没有那么难。只是在真正实现项目的过程中,踩过了好多坑。一,该链接中讲到Vue对typescript的支持:https://cn.vuejs.org/v2/guide/typescript.html二,typescript是什么?...原创 2019-07-05 15:27:29 · 2022 阅读 · 0 评论 -
vue书写原生数据劫持,包括对象与数组两个方向
转自:https://blog.csdn.net/qq_32766999/article/details/91867694转载 2019-06-14 13:58:00 · 109 阅读 · 0 评论