组件组件是什么:组件就是自定义标签,他是vue中核心功能之一,是把页面当中的可以重复使用的内容进行封装,方便调用全局组件    作用域:在所有实例中都可以使用    语法:Vue.component:{"组件名不能喝现有的html标签重名",{        template:"<div>&lt
转载 2024-10-04 14:59:29
78阅读
vue2.0之后有哪些变化:   1.每个组件模板template,不再支持片段代码     之前:       <template>         <h3>vue-router+vue-loader</h3>         <p>hshsh</p>       </template>   现在:必须有根元
转载 6月前
27阅读
数据驱动概念数据驱动指的是:视图是由数据驱动生成的,我们对视图的修改,不会直接操作 DOM,而是通过修改数据。只关心数据的修改会让代码的逻辑变的非常清晰,因为 DOM 变成了数据的映射,我们所有的逻辑都是对数据的修改,而不用碰触 DOM,这样的代码非常利于维护。new Vue 过程Vue 类的定义入口:src/core/instance/index.js// 创建了 Vue 类 function
转载 2024-10-28 22:17:45
66阅读
1.导航钩子的作用vue-router提供的导航钩子主要用来拦截导航,让它完成跳转或取消。2.导航钩子的分类全局守卫路由独享守卫局部守卫3.全局守卫是指路由示例上直接操作的钩子函数,特点是所有路由配置的组件都会触发。简单点说就是触发路由就会触发这些钩子函数。钩子函数执行顺序包括beforeEach、beforeResolve、afterEach三个。[beforeEach]:在路由跳转前触发,参数
BaseButton组件 父里默认情况下对着封装的组件,加clcik事件无效。<base-button @click="del"></base-button>因为这不是原生的标签,而是一个组件。 而组件希望能够被 @事件名 的语法触发一些事件,就必须在组件内部用 5emt("事件名) 写这个事件名才能触发 所以,来到BaseButton这个组件内部,给按钮加一个点击事件,点
前言在我们了解router的实现原理之前,我们先来聊聊vue的路由跳转到底是怎样的吧!首先,我们知道vue创建的项目其实是一个单页应用。在我们对vue项目进行打包以后,我们所有的代码都会被成一份HTML和一份JS,那我们创建的那么多.vue文件是如何实现通信的呢?这时我们今天的主角就登场啦,vue-router就是vue官方定义的路由插件,其作用有如下两点:路由用户设定访问路径的,将路径和组件映射
作者:一个大西瓜 摘要学习本篇之前要具备一定的vue基础知识,可以先看一下Vue基础(环境配置、内部指令、全局API、选项、内置组件)1、Vue-cliVue-cli是vue官方出品的快速构建单页应用的脚手架,这里牵扯的东西很多,有webpack,npm,nodejs,babel等等。官网:https://cli.vuejs.org/guide/GitHub:https://github
1、前言本篇是Vue中最常用到的API之一computed属性作者:gunelark2、正文看了网上很多资料,对vue的computed讲解自己看的都不是很清晰,今天忙里抽闲,和同事们又闲聊起来,对computed这个属性才有了一个稍微比较清晰的认识自己的理解:computed用来监控自己定义的变量,该变量不在data里面声明,直接在computed里面定义,然后就可以在页面上进行双向数据绑定展示
转载 2024-02-20 09:41:12
51阅读
在实例创建完成后被立即调用。在这一步,实例已完成以下的配置:数据观测 (data observer),属性和方法的运算,watch/event 事件回调。然而,挂载阶段还没开始,$el属性目前不可见。 methods、data、watch等可以使用了。
转载 2018-06-21 11:29:00
285阅读
2评论
如果created阶段发送的请求,第二个请求要依赖第一个请求返回的数据作为参数,不妨这么做:async created() { await this._getResourceId(); await this._getTerritory(); },
原创 2022-11-18 00:05:32
203阅读
vue 组件传值之 listenersvue的通信方法常用的有,父传子 props, 子传父 通过绑定@事件,子组件$emit 传值,也可以父组件给子组件props传递一个函数,子组件调用函数,利用参数传值。其他的还有vuex集中状态管理,eventBus也就是事件的全局$emit, $on 来抛发事件传值以及接下来的 $attrs、$listeners 。其实这两个属性的模式,也就是父组件A把很
先说一下async的用法,它作为一个关键字放到函数前面,用于表示函数是一个异步函数,因为async就是异步的意思, 异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 写一个async 函数:async function timeout() {   return 'hello world'; }语法很简单,就是在函数前面加上async 关键字,来表示它是异步的,那怎么调用呢?async 函数也
文章目录1.什么是动态组件2.如何实现动态组件渲染?3.如何实现缓存组件?4.异步组件 1.什么是动态组件当我们希望页面中的某个地方,在不同组件之间进行动态切换,这时候除了条件渲染,还可以使用动态组件。2.如何实现动态组件渲染?vue提供了一个内置的组件,专门用来实现动态组件的渲染:通过 is 属性动态指定要渲染的组件因为要渲染的组件是不确定的,所以要通过data申明一个变量用来接收组件的名称,
案例来说事儿:建设一个网站统计:需要调取一万个数据的展示 耗时较大。此时完美的解决方案:在页面加载结束后:数据展示gif动态提示 请您稍后,数据提取中。。。等字眼提示数据提取结束 提示小时 展示铺垫数据此时过程就是:created()来预处理提示语句mounted()来处理数据提取 提取数据后的替换created:在模板渲染成html前调用,即通常初始化某些属性值,然后再渲染成...
原创 2021-08-30 17:52:10
3067阅读
一、前言 vue.js中created方法是一个生命周期钩子函数,一个vue实例被生成后会调用这个函数。一个vue实例被生成后还要绑定到某个html元素上,之后还要进行编译,然后再插入到document中。每一个阶段都会有一个钩子函数,方便开发者在不同阶段处理不同逻辑。 一般可以在created函数中调用ajax获取页面初始化所需的数据。 二、实例生命周期 每个 Vue 实例在被创建之前都要经过一
原创 精选 2023-03-29 08:50:12
2038阅读
1点赞
1评论
好的!今天探索Vue的生命周期,鉴于生命周期这个东西很简单,所以直接写源码版了简单到什么程度呢,就是直接执行你的 created 什么的,只是分在什么时候执行而已但是!我们仍然要分两个问题,理清思路方便记忆 1、生命钩子怎么触发 2、生命钩子在什么时候触发 钩子怎么触发首先,我设置了下面的例子 那么 el 和 created 就是你传入 Vue
一、路由与路由器 路由(route):路径和组件的匹配;路由器(router):管理这些匹配规则的一个管理者; vue-router的理解vue的⼀个插件库,专⻔⽤来实现SPA应⽤对SPA应⽤的理解1. 单⻚⾯web应⽤(single page web application,SPA)2. 整个应⽤只有⼀个完整的⻚⾯3. 点击⻚⾯中的导航链接不会刷新⻚⾯,只会做⻚⾯的局部更新4
转载 2024-04-13 09:30:47
137阅读
Vue组件化的实现和使用步骤注册组件的基本步骤创建组件构造器注册组件使用组件具体实现[最基础的使用]:<!doctype html> <html> <head> <meta charset="utf-8"> <title>vue事件监听练习</title> </head> <script src="./js/
转载 2024-10-16 15:40:27
97阅读
大多数人在谈论生命周期钩子时会感到困惑的一件事是 ​​created​​​ 和 ​​mounted​​之间的区别。有着相似的名称,觉得应该做同样的事情,但还是有一些细微的差别。
原创 2022-10-20 09:57:18
616阅读
参考博客: https://blog.csdn.net/ygy211715/article/details/80079603 https://www.cnblogs.com/dehuachenyunfei/p/11811969.html created官方解释: created是在实例创建完成后被立 ...
转载 2021-07-29 10:47:00
692阅读
2评论
  • 1
  • 2
  • 3
  • 4
  • 5