
VUE
文章平均质量分 78
devincob
熬代码者
展开
-
Vue3的setup还能这么用?
这里写自定义目录标题欢迎使用Markdown编辑器前言setup注意点合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Ma原创 2021-11-30 09:12:05 · 1427 阅读 · 0 评论 -
vue3.0 vite安装
vue3.0 vite安装安装 Vitenpm install -g create-vite-app利用 Vite 安装 Vue3.0 项目create-vite-app projectName安装依赖运行项目cd projectName //进入工程项目文件夹npm install //安装项目依赖npm run dev //运行项目...原创 2021-03-09 23:05:20 · 1100 阅读 · 0 评论 -
虚拟dom实现原理+源码解析
虚拟Dom原理vue 虚拟dom实现原理Vue面试题总结(长期更新)Vue源码解析Vue面试题精编前端最强面经汇总前端面试题文档前端实用文档前端面试题目面试资源汇总中级前端面试原创 2020-06-11 14:04:05 · 469 阅读 · 0 评论 -
使用Vue编写自定义指令
自定义指令编写的方式有2种1、全局自定义指令全局的指令必须要在实例化之前进行定义Vue.directive(参数1,参数2)参数1: 指令的名称参数2: 指令实现的函数参数2-1: el 指令作用的元素参数2-2: 对象 {modifiers:修饰符 value:表达式的结果}2、局部自定义指令在vue中添加一个熟悉 directives key值是指令名称 value是指令实现的函数贴一篇完整code<!DOCTYPE html><html原创 2020-05-28 14:12:56 · 886 阅读 · 0 评论 -
项目遇到的bug 汇总
Q: 谈谈你对 TCP 的理解;Q: TCP 是在哪个OSI 的哪个层!通讯过程是全双工还是半双工(单工)?A: 传输层,全双工Q: TCP的通讯的过程是怎么样的!A: 整个过程是三次握手,四次挥手…Q: 你说的没错,说说整个过程如何?A: 举个栗子,我把 TCP 比做两个人用对讲机沟通(大白话)…三次握手就是.A1(吼叫方,客户端)想要呼叫 A2(控制室的某某,服务端)…A1对着对...原创 2020-03-26 17:27:09 · 248 阅读 · 0 评论 -
进度条组件mark
子组件内容:template部分<template> <div class="slider" ref="slider"> <div class="process" :style="{width}"></div> <div class="thunk" ref="trunk" :style="{left}...原创 2020-03-16 13:05:53 · 233 阅读 · 0 评论 -
vue项目打包需要修改的路径问题
博客园 首页 新随笔 联系 管理 订阅订阅 随笔- 55 文章- 0 评论- 1vue-cli项目打包需要修改的路径问题命令行输入:npm run build打包出来后项目中就会多了一个文件夹dist,这就是我们打包过后的项目。第一个问题,文件引用路径。我们直接运行打包后的文件夹中的index.html文件,会看到网页一片空白,f12调试,全是css,js路径引用错误的问...原创 2020-03-09 16:49:48 · 6358 阅读 · 0 评论 -
vue2开发中实例事件总结($on,$once,$off,$emit,$root,$refs,$parent 的使用)
1.实例事件就是在构造器外部调用构造器内部的数据。2.使用场景:比如构造器已经有一个加的方法,现在还要做一个减的方法,而我又不想动构造器里面的信息,那就可以使用实例事件了.操作如下:与on对应的还有一个on对应的还有一个on对应的还有一个once,上述代码只改一个单词$once app.$once('reduce',function(){ console.log("减...原创 2020-01-01 17:24:26 · 1979 阅读 · 0 评论 -
watch、computed和method的区别以及与props,data的加载顺序
/*当页面中有某些数据 依赖 其他数据 进行变动的时候,可以使用计算属性。需要注意的是,就算在 data中没有直接声明 出要计算的变量,也可以直接在computed中写入。计算属性默认只有getter,可以在需要的时候自己设定setter:使用场景:computed擅于处理:一个数据受多个数据影响即在这多个依赖数据中,任何一个改变都会导致 受影响的数据的改变*/computed: ...原创 2019-07-19 16:46:41 · 1403 阅读 · 0 评论 -
Vue router($router,$route和守卫)
flex布局传送门导航守卫传送门完整的导航解析流程导航被触发。在失活的组件里调用离开守卫。调用全局的 beforeEach 守卫。在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+)。在路由配置里调用 beforeEnter。解析异步路由组件。在被激活的组件里调用 beforeRouteEnter。调用全局的 beforeResolve 守卫 (2.5+...原创 2019-07-04 16:56:28 · 359 阅读 · 0 评论 -
详解vue生命周期
首先,每个Vue实例在被创建之前都要经过一系列的初始化过程,这个过程就是vue的生命周期。首先看一张图吧~这是官方文档上的图片相信大家一定都会很熟悉:可以看到在vue一整个的生命周期中会有很多钩子函数提供给我们在vue生命周期不同的时刻进行操作, 那么先列出所有的钩子函数,然后我们再一一详解:beforeCreatecreatedbeforeMountmountedbeforeUpd...原创 2023-06-16 09:46:26 · 110 阅读 · 0 评论 -
JSON.parse()和JSON.stringify()方法解析和使用
再做后台管理系统的或者其他需要更改编辑 原绑定数据的时候 容易 忽略 数据拷贝带来的问题 代码 容易这样写 这里就是深拷贝问题 如果直接赋值 就会造成原数据的改变 如果拷贝的数据是数组可以用map转化 如果是对象可以用JSON.parse(JSON.stringify(item))这种方式转化...原创 2018-06-28 11:11:35 · 2267 阅读 · 0 评论 -
Vue 中 $refs的使用
说明:vm.$refs 一个对象,持有已注册过 ref 的所有子组件(或HTML元素)使用:在 HTML元素 中,添加ref属性,然后在JS中通过**vm.$refs.**属性来获取注意:如果获取的是一个子组件,那么通过ref就能获取到子组件中的data和methods添加ref属性&amp;amp;amp;amp;amp;amp;amp;amp;lt;div id=&amp;amp;amp;amp;amp;amp;amp;quot;app&amp原创 2018-12-19 16:34:51 · 3246 阅读 · 0 评论 -
Vue-选项/数据
Vue.extend( options )Vue.set( target, key, value )原创 2018-12-20 14:17:17 · 713 阅读 · 0 评论 -
详解Vue的生命周期
vue组件的生命周期Vue所有的生命周期钩子自动绑定在this上下文到实例中,因此你可以访问数据,对属性和方法进行运算。这意味着你不能使用箭头函数来定义一个生命周期方法。这是因为箭头函数绑定了父上下文,因此this与你期待的Vue实例不同。1、beforeCreate 在实例初始化之后,数据观测和event/watcher时间配置之前被调用。2、created 实例已经创建完成之后被...原创 2018-12-21 11:12:51 · 514 阅读 · 0 评论 -
Vue 中 $set的使用
-------------------------------------------------------------------------------code示例----------------------------------------------------------------------------在我们使用vue进行开发的过程中,可能会遇到一种情况:当生成vue实例后...原创 2018-12-21 15:27:27 · 38446 阅读 · 3 评论 -
Vue 中 render函数
原创 2018-12-21 15:56:51 · 172 阅读 · 0 评论 -
Vue全局API
// 让 dialog 支持鼠标拖动import Vue from ‘vue’import jQueyr from ‘jquery’const MSIE = (/Trident|IE/i.test(navigator.userAgent))/**指令使 Dialog 可移动*/Vue.directive(‘drag-dialog’, {update(el, binding){...原创 2019-07-02 11:46:57 · 156 阅读 · 0 评论 -
VueJS实例中data属性的三种写法及区别
data属性的三种写法一、<script type="text/javascript"> var app=new Vue({ el:'#app', data:{ isLogin: false } })</script>二、<script type="text/javas...原创 2019-01-14 15:51:03 · 908 阅读 · 0 评论 -
Vue组件之间的通讯方式数据处理:父子组件,兄弟组件,同级组件,爷孙组件
介绍vue 组件之间通讯的方式原创 2018-05-14 17:36:25 · 1626 阅读 · 1 评论