一、vue组件1.1 子组件传值父组件子组件调用父组件的方法在父组件中给引用的子组件注册一个事件(这个事件的名字是自定义的)子组件可以触发这个事件$emit('事件名字')子组件给父组件传递数据$emit方法第二个参数可以定义子组件给父组件传递的内容在父组件中怎么拿到这内容2.1 父组件这个方法没有自定参数,在父组件的方法直接加这个参数就可以拿到2.2 父组件有自定义参数,可以传入$event也可
转载
2024-05-18 16:31:30
97阅读
组件的创建和patch过程
组件化组件化是vue的另一个核心思想,所谓的组件化,就是说把页面拆分成多个组件(component),每个组件依赖的css、js、图片等资源放在一起开发和维护。组件是资源独立的,在内部系统中是可以多次复用的,组间之间也是可以互相嵌套的。
接下来我们用vue-cli为例,来分析一下Vue组件是如何工作的,还是它的创建及其工作原理
转载
2024-06-28 21:44:38
315阅读
基本使用都满足 包括常用的: 时间格式 :type [date,datetime,daterange ....] 快捷方式 :日期左侧:如 今天,昨天,一个月前日期 日期禁用:禁用日期段 其它相关属性 custom-date-picker 组件内容 <!-- 1、isShortcut <boolea ...
本篇主要介绍非单文件组件( Vue.component创建的组件其中包括函数式组件)在项目中的使用,会用到以下api:Vue.component()、Vue.extend()、$createElement、patch()。单文件组件:文件扩展名为 .vue 的 single-file components (单文件组件)。从事vue开发的小伙伴,平时组件化的过程中大多都采用 单
转载
2024-02-17 13:12:05
154阅读
第六单元(vue的实例和组件-vue实例的相关属性和方法-解释vue的原理-创建vue的组件)
#课程目标掌握vue实例的相关属性和方法的含义和使用了解vue的数据响应原理熟悉创建组件,了解全局组件与局部组件的区别,掌握组件的相关注意事项
#知识点
#1.vue实例的相关属性和方法ß
#1.1 属性Vue实例就是通过new Vue()得到的对象。 我们可以在先在控制台中打印一下vue的实例,如图:
Vue中的组件分为两种,一种是自定义组件,另外一种就是内置组件。内置组件是Vue已经封装好的组件,总共就五个内置组件Vue的内置组件其实我们在一些场景中使用过,但是我们没有系统的了解,这里我们总结一下所有的内置组件和其属性参数。componen组件这个内置组件用于动态切换页面部分区域的视图,它有两个属性:
is:根据它的值来渲染需要显示的视图
inline-template:用于表示是否能显示通过
转载
2024-06-23 10:09:25
85阅读
创建vue组件一、’创建vue组件有四个步骤: 全局组件 1.先命名,用Vue.extend()构建一个你需要渲染的html;创建一个模版 2.调用Vue.component('Html里自己创建的标签',1步骤中创建的构造器名称);注册 3.创建一个vue实例,让其他的挂载在其标签下面; &nbs
转载
2024-04-24 11:50:00
79阅读
参考vue文件地址:递归组件实现遍历效果递归组件实现思路:遍历数组元素,并判断子元素的子集数量是否大于0。如果子集的集合数量大于0,则需要需要再一次调用该组件。如果子集的集合数量等于0,则直接显示内容。创建组件<!-- subordinate:判断是否为子集递归; activeNames:打开折叠面板的集合。 -->
<van-collapse v-if="!subord
转载
2024-02-29 17:08:53
136阅读
1.组件,什么是组件,可以这样理解,一个页面有可能包含很多逻辑,很混乱,当我们将这一大坨东西分为很多个小东西,每一个小东西只完成自己的功能,和其他的小东西互不干涉,页面想要使用,只需要引入就行了。 2.组件的使用可分为三步:一创建组件构造器,二注册组件,三使用组件 3.其实每一个组件就相当于一个vue实例,它也有自己的template,method,data,components这些东西,data
转载
2024-04-03 12:51:40
155阅读
vue项目使用layui的树形表格treeTable扩展组件
首先我的vue项目vue脚手架创建的。第一步(下载): 下载扩展组件treeTable的js,treeTable有3个版本,我个人推荐使用最新版本,即3.0版本。  
转载
2024-03-25 07:20:08
753阅读
全局组件注册 //1.开发全局组件 Vue.component('login',{ template:'<div><h1>用户登录</h1></div>' }); //2.使用全局组件 在Vue实例范围内 <login></login> # 注意: - 1.Vue.component用来开发全局组件 ...
转载
2021-09-13 18:12:00
155阅读
2评论
vue如何封装一个通用组件vue如何封装一个全局组件vue封装公共头部组件
转载
2020-04-24 14:26:00
693阅读
2评论
转载
2018-04-07 21:10:00
140阅读
2评论
<!-- 组件会在 `currentTabComponent` 改变时改变 --><component v-bind:is="currentTabComponent"></component>
原创
2023-05-19 15:22:08
116阅读
1.什么是组件 组件(Component)是 Vue.js 最强大的功能之一。 组件可以扩展 HTML 元素,封装可重用的代码。 组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的界面都可以抽象为一个组件树: 注册一个全局组件语法格式如下: Vue.component(tag ...
转载
2021-08-19 19:22:00
263阅读
2评论
<el-date-picker v-model="form.date" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"> 组件: ...
转载
2021-08-15 16:35:00
1738阅读
2评论
组件一:组件组件可以看作是一些可复用的ui模块小到一个标签:<div>哈哈</div>大到一个页面:<div><div><div><div><div></div></div></div></div></div>一个组件对应一个实例组件===Vue实例==n
原创
2020-06-21 22:19:55
1088阅读
Vue 组件的使用组件的两种命名方式使用 kebab-case Vue.component('my-component-name', { /* ... */ })当使用 kebab-case (短横线分隔命名) 定义一个组件时,你也必须在引用这个自定义元素时使用 kebab-case,例如 。使用 PascalCaseVue.component('MyComponentName', { /* ... */ })当使用 PascalCase (首字母大写命名) 定义一个组件时
原创
2022-01-10 10:45:45
181阅读
vue中组件是可复用的Vue实例,带有一个名字。我们可以在一个通过newVue创建的Vue根实例中,把这个组件作为自定义元素来使用,它们与newVue接收类似例如data、computed、watch、methods以及生命周期钩子这样相同的选项,一个应用会以一棵嵌套的组件树的形式来组织:个人理解组件可分为以下几类:1.接入型container2.展示型3.交互型比如各类加强版的表单组件,大部分的
原创
2018-05-07 21:24:12
710阅读
点赞
组件化是vue的精髓,vue就是由一个一个的组件构成的。Vue的组件化设计到的内容又非常多,当在面试时,被问到:谈一下你对Vue组件化的理解。这时候又有可能无从下手,因此在这里阐释一下个人对Vue的组件化的理解。 组件的分类 一般来说,组件大致可以分为三类: 页面级别的组件。 业务上可复用的基础组件
转载
2020-12-11 16:26:00
1124阅读
2评论