一、递归组件组件在它的模板内可以递归地调用自己, 只要给组件设置name 的选项就可以了。示例如下: <div id="app19"> <my-component19 :count="1"></my-component19> </div>Vue.component('my-component19',{ name: 'my-com...
原创 2022-03-29 10:16:32
175阅读
子通信父 父组件 <template> <div class="parent"> 我是父组件 <!--父组件子组件触发的say方法,调用自己的parentSay方法--> <!--通过:msg将父组件的数据传递给子组件--> <children :msg="msg" @say="parentSa
转载 2020-12-08 13:36:00
96阅读
2评论
vue项目的一大亮点就是组件化。使用组件可以极大地提高项目中代码的复用率,减少代码量。但是使用组件最大的难点就是父子组件之间的通信。子通信父父组件<template> <div class="parent"> 我是父组件 <!--父组件监听子组件触发的say方法,调用自己的parentSay方法--> <!--通过:m...
开端 最近在恶补vue底层和高级用法相关的知识,找的视频跟着老师学习,本篇文章主要是记录在学习过程中都学习到了哪些内容,理清一下自己的思路。 1 mixins混入 混入(mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。 类似于<script>中的内
原创 精选 2024-03-22 14:10:45
204阅读
世界上有太多孤独的人害怕先踏出第一步。 ---绿皮书 书接上回,上篇介绍了vue组件通信比较有代表性的几种方法,本篇主要讲述一下组件的...
原创 2022-03-16 11:49:57
262阅读
假设有如下代码:<div>  <p>FullName: {{fullName}}</p>  <p>FirstName: <input type="text" v-model="firstName"></p> </div> new Vue({  el: '#root',  data: {  firstName: 'D
原创 2019-09-08 15:42:42
352阅读
Vue 是一款流行的 JavaScript 框架,广泛用于构建现代化的用户界面。其中一个强大的特性是指令,它们允许你在模板中添加特殊行为和
原创 2023-09-25 16:10:52
6398阅读
Vue Router 是 Vue.js 官方的路由管理器,它可以帮助你构建单页面应用 (SPA),并实现页面之间的无缝切换。本文将深入探讨 Vue Router 的高级用法,并通过实战案例带你掌握其使用技巧。一、Vue Router 基础1. 安装 Vue Routernpm install vue-router2. 配置路由import Vue from 'vue'; import VueRou
Vue
原创 精选 6月前
259阅读
多线程 ...
转载 2021-08-09 16:52:00
161阅读
2评论
本篇文章干货较多,建议收藏! 从 vue2 升级到 vue3,vue3 是可以兼容 vue2 的,所以 vue3 可以采用 vue2 的
原创 2021-11-22 09:49:54
10000+阅读
1点赞
文章目录动态节点收集与补丁标志1.传统diff算法的问题2.Block和PatchFlags3.收集动态节点3.渲染器运行时支持4.Block树静态提升预字符化缓存内联事件处理函数v-once 动态节点收集与补丁标志1.传统diff算法的问题对于一个普通模板文件,如果只是标签中的内容发生了变化,那么最简单的更新方法很明显是直接替换标签中的文本内容。但是diff算法很明显做不到这一点,它会重新生成
今天要介绍的是路由元信息,滚动行为以及路由懒加载这几个的使用方法。1.路由元信息什么是路由元信息,看看官网的解释,定义路由的时候可以配置 meta 字段可以匹配meta字段,那么我们该如何使用它,一个简单的例子,改变浏览器title的值。下面上代码。//简单的我就不写了直接上解决方案import Vue from 'vue'import Router from 'vue-router'...
原创 2022-03-29 10:16:36
70阅读
假设有如下代码: 上面的代码的效果是,当我们输入firstName后,wacth监听每次修改变化的新值,然后计算输出fullName。 handler方法和immediate属性 这里 watch 的一个特点是,最初绑定的时候是不会执行的,要等到 firstName 改变时才执行监听计算。那我们想要
转载 2019-01-12 15:05:00
72阅读
2评论
# 用生成器(generators)方便地写惰性运算 def double_numbers(iterable): for i in iterable: yield i + i # 生成器只有在需要时才计算下一个值。它们每一次循环只生成一个值,而不是把所有的 # 值全部算好。这意味着double_numbers不会生成大于15的数字。 # # range的返回值也是一个生成
( Vue 3 组合式 API 高级用法解析 ) 1. 引言 Vue 3 的 组合式 API(Composition API) 相较于 Vue 2 的 选项式 API(Options API),不仅提升了逻辑复用性和代码组织结构,还在性能优化、类型推导、响应式管理等方面带来了全新的体验。 在本文中,我们将深入探讨 Vue 3 组合式 API 的高级用法,包括: 依赖注入(provide/inj
原创 精选 6月前
399阅读
本篇文章将介绍函数相关的几个高级用法,如创建匿名函数、递归函数、装饰器,偏函数等。一、匿名函数Python中,可以不用def关键字创建函数,使用lambda表达式创建匿名函数,语法格式如下lambda param1,...paramN:expression匿名函数也是函数,与普通函数一样,参数也是可选的,如下,使用lambda表达式创建一个函数对象func1=lambda x,y:x+y prin
一、概述可迭代的对象可以使用for循环进行遍历,例如:字符串、列表、字典、元组和集合for循环里面有一个隐藏的机制,就是自动执行index+1,直到遍历完整个序列类似于JAVA的for (Object o : list){}二、用法# for循环中,obj 为变量,用来接收序列中的元素 list=['Hello','World','code_space'] for obj in list:
Composition API 提供了两种在组件中引入响应式状态的方式。因此,你需要在 ref()、reactive() 之间决定使用哪一个,或是两者都用。本文将帮助你做出正确的选择,但让我们先快速介绍一下这两种方式。快速介绍ref() 和 reactive() 用于跟踪其参数的更改。当使用它们初始化变量时,是向 Vue 提供信息:“嘿,每次这些变量发生更改时,请重新构建或重新
转载 2024-08-05 21:40:22
142阅读
1、v-on:click='num++':绑定数据对象中num值;2、@click='num++':v-on缩写,绑定数据对象中num值;3、@click='handle':绑定函数对象handle;4、@click='handle()':绑定函数handle; <!DOCTYPE html> <h ...
转载 2021-07-20 11:18:00
215阅读
2评论
【前言】 新创建的vue项目的main.js中,App组件的渲染用了render方法来实现组件的渲染。模板渲染除了开发常使用的template之外,还有render方法。当把main.js中的模板改成render方式,会发现控制台报错。 【目标】1.render方法与template区别; 2.了解render方法的使用方法; 3. createElement的使用方法;已有template模板渲
原创 6月前
100阅读
  • 1
  • 2
  • 3
  • 4
  • 5