Vue 全家桶
关注
分享
扫一扫
文章平均质量分 68
vue+vue-router+-vuex
一颗不甘坠落的流星
前端专栏博主，目标是归纳前端所需要各种技术的使用，不是在补充、就是在重写博客的路上，一步步完善中。
展开
-
【Vue】首屏加载优化
vue 首屏加载优化方案，面试高频原创 2024-03-12 15:28:27 · 1110 阅读 · 0 评论 -
【Vue】父子组件嵌套下各生命周期的执行顺序
vue 中父子组件嵌套下各生命周期的执行顺序原创 2024-03-12 10:19:43 · 1345 阅读 · 0 评论 -
【Vue】实现 vuex 状态持久化
vuex 实现状态持久化，面试高频原创 2024-03-11 17:48:48 · 1133 阅读 · 0 评论 -
【Vue】.sync 修饰符作用
.sync 修饰符简单来说就是实现父子组件数据之间的双向绑定，当子组件修改了一个 `props` 的值时，也会同步到父组件中，实现子组件同步修改父组件，与`v-model`类似。原创 2024-03-11 16:33:45 · 817 阅读 · 0 评论 -
【Vue】ref 的使用
如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件。// this.$refs.child 是 组件的实例。ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的。原创 2021-04-09 22:40:59 · 723 阅读 · 0 评论 -
【Vue】使用 h() 函数用于创建 vnodes
>- h() 是 hyperscript 的简称——意思是“能生成 HTML (超文本标记语言) 的 JavaScript”。>- 这个名字来源于许多虚拟 DOM 实现默认形成的约定。>- 一个更准确的名称应该是 createVnode()，但当你需要多次使用渲染函数时，一个简短的名字会更省力原创 2021-04-09 21:44:48 · 745 阅读 · 0 评论 -
【Vue】render 方法的使用
render 是字符串模板的一种替代，可以使你利用 JavaScript 的丰富表达力来完全编程式地声明组件最终的渲染输出。原创 2021-04-09 22:16:26 · 857 阅读 · 0 评论 -
【Vue】key 值用法
key 的特殊 attribute 主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用 key，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试就地修改/复用相同类型元素的算法。而使用 key 时，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。当数据项的顺序改变时，Vue 不会随之移动 DOM 元素的顺序，而是就地更新每个元素，确保它们在原本指定的索引位置上渲染。原创 2021-06-15 15:27:15 · 1388 阅读 · 0 评论 -
【Vue】＜component＞ 内置元素
渲染一个“元组件”为动态组件。依 is 的值，来决定哪个组件被渲染。原创 2021-06-15 15:24:44 · 1609 阅读 · 0 评论 -
【Vue】Vuex 用法案例（一篇足以）
vuex 各种属性、方法的使用案例原创 2022-08-06 16:08:48 · 1247 阅读 · 0 评论 -
【Vue】router 路由方法
push()、replace()、resolve()、go()、back()、forward() 等方法的使用。原创 2022-08-02 10:59:19 · 691 阅读 · 0 评论 -
【Vue】Route 路由属性解析
hash ：已解码 URL 的 hash 部分。总是以 #开头。如果 URL 中没有 hash，则为空字符串 。query ：从 URL 的 search 部分提取的已解码查询参数的字典 。path ：编码 URL 的 pathname 部分，与路由地址有关 。。。。...原创 2022-08-01 15:08:41 · 574 阅读 · 0 评论 -
【Vue】eventbus 首次$on事件未绑定问题
问题背景：A页面跳转到B页面，并传参过去，但是第一次跳转过去不会触发$on事件，第二次能触发但是触发了两次，后面每点一次就会比之前多触发一次原创 2022-08-01 11:17:00 · 1548 阅读 · 0 评论 -
【Vue】通过事件发布订阅实现跨组件传值
这种通过创建一个空的 vue 实例的方式，相当于创建了一个事件中心或者说是中转站，用来传递和接收事件。这种方式同样适用于任何组件间的通信，包括父子、兄弟、跨级，对于通信需求简单的项目比较方便，但对于更复杂的情况，或者项目比较大时，可以使用 vue 提供的更复杂的状态管理模式 Vuex 来进行处理...原创 2022-07-29 16:52:57 · 466 阅读 · 0 评论 -
【Vue】provider/inject 祖孙传值
provider/inject 祖孙传值，多层父子结构关系传值原创 2022-07-29 16:29:49 · 1419 阅读 · 0 评论 -
【Vue】watch 监听 url 地址参数变化（路由变化）
watch 监听 url 地址参数变化或路由变化使用案例原创 2022-07-28 20:35:40 · 4718 阅读 · 0 评论 -
【Vue】use 插件用法
Vue.use使用方法，插件通常用来为 Vue 添加全局功能。原创 2022-07-27 14:44:27 · 1129 阅读 · 0 评论 -
【Vue】全套$...方法使用
文章目录一、事件监听事件：$on监听一次：$once移除监听：$off触发事件：$emit二、数据监听数据：$watch添加数据：$set删除数据：$delete三、生命周期手动挂载：$mount()强制渲染：$forceUpdate()延迟更新：$nextTick()销毁实例：$destroy()四、属性根元素：$el根属性：$root父组件：$parent子组件：$children各组件：$refs各配置：$options()一、事件监听事件：$on$on：监听当前实例上的自定义事件。事件可以原创 2022-07-25 11:27:02 · 2341 阅读 · 0 评论 -
【Vue】动态组件用法（is 与 keep-alive）
is动态绑定与keep-alive组件缓存的用法原创 2022-07-23 16:01:04 · 412 阅读 · 0 评论 -
【Vue】slot 插槽用法
具名插槽、匿名插槽、作用域插槽的使用原创 2022-07-23 11:06:58 · 959 阅读 · 0 评论 -
【Vue】class 与 style 样式绑定
class 与 style 样式绑定的使用原创 2022-07-23 10:37:24 · 225 阅读 · 0 评论 -
【Vue】自定义组件绑定 v-model
自定义组件绑定 v-model 使用案例原创 2022-07-22 12:53:22 · 4281 阅读 · 0 评论 -
【Vue】vue 组件各选项用法
传值：props、数据：data、监听：watch、计算：computed、方法：methods 的使用案例混入：mixins、继承：extends、传值：provider / inject 的使用案例组件：components、过滤：filters、指令：directive 的使用案例原创 2022-07-22 11:45:34 · 1046 阅读 · 0 评论 -
【Vue】全局方法的使用
Vue.component 组件、Vue.mixin 混入、Vue.filter 过滤、Vue.directive 自定义指令的使用原创 2022-07-22 09:31:00 · 5145 阅读 · 0 评论 -
【Vue】单文件组件 CSS 功能
单文件组件 CSS 功能及 scoped 属性的用法原创 2022-07-22 08:49:50 · 506 阅读 · 0 评论 -
【Vue】各v-指令用法
v-html、v-text、v-show、v-if、v-for、v-on、v-bind、v-model、v-once、v-cloak、v-pre、v-slot 等指令的使用原创 2022-07-21 16:47:21 · 2711 阅读 · 0 评论 -
【Vue】axios 配置详解
文章目录1.axios 定义2. 特性3.安装和使用4.请求写法5.并发请求6.创建实例7.实例方法8. 请求配置9.响应结构10.配置默认值全局的 axios 默认值自定义实例默认值11.拦截器1.axios 定义Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中2. 特性axios 的优势：从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据原创 2021-04-08 15:50:31 · 5502 阅读 · 0 评论 -
【Vue】生命周期钩子
每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做**生命周期钩子**的函数，这给了用户在不同阶段添加自己的代码的机会。...原创 2021-04-06 21:33:47 · 410 阅读 · 0 评论 -
【Vue】图片引入方式
方法一：在 data 中定义在data()里面定义好图片路径，需要在链接外面加上requiredata(){ return { imgUrl:require("../assets/test.png"), }}在template模板里面使用，需要使用v-bind (简写 : )绑定图片的src属性<template> <img :src="imgUrl"></template>方法二：使用 import 导入引入：import原创 2021-04-06 19:19:20 · 656 阅读 · 0 评论 -
【Vue】export 导出用法
在JavaScript ES6中，**export** 与 **export default** 均可用于导出常量、函数、文件、模块等，你可以在其它文件或模块中通过 **import+(常量 | 函数 | 文件 | 模块)名** 的方式，将其导入，以便能够对其进行使用...原创 2021-04-06 17:32:48 · 3807 阅读 · 0 评论 -
Vue vscode 创建 vue 项目流程【超详细】
文章目录一、安装node二、配置淘宝镜像三、配置 vscode（win10）四、全局安装脚手架五、创建项目六、进入项目七、项目结构一、安装node请在官网下载安装：https://nodejs.org/zh-cn/vscode 中 点击 ( ctrl + `) 调出终端输入指令node -v，能显示版本号，说明 node 已经装好了输入指令npm -v，能显示版本号，说明 npm 可以使用了点击链接查看图文教程https://blog.youkuaiyun.com/qq_45677671/ar原创 2021-04-02 10:05:49 · 63367 阅读 · 20 评论 -
【Vue】template 模板用法
文章目录一、在HTML5中二、在JavaScript中三、在Vue中写在vue构造器里写在template标签里写在script标签里（官方推荐）一、在HTML5中template标签：其内容隐藏在客户端之外该内容在加载页面是不会呈现，不会渲染出任何信息相当于自带属性：template {display: none;}<body> <template> <!-- 该标签内容是不可见的 --> 内容模板元素 </原创 2021-03-30 18:38:18 · 62606 阅读 · 1 评论