作者|Sunil Sandhu 译者|王强 编辑|可可 前几天,我们曾和大家探讨了 React、Angular、Vue.js 三大框架优缺点。 我在工作中使用 Vue 有一段时间了,对它了解也相当深刻,但我很想知道围墙另一边草是什么样——这里所说草指就是 React。我阅读了很多 React 文档并观看了一些教学视频,它们的确很棒,但我真正想知道是 Rea
转载 4月前
396阅读
封装vue组件两种方法和形式: 一:是建立一个webpack-simple 项目 二:是在通过vue-cli脚手架建立webpack vue项目,这种项目有点冗余,可是我们对这种项目最熟悉 下面分别介绍两种用法: 一: 1.首先先建立一个vue项目: 通过vue init webpack-sim
转载 2020-02-20 16:24:00
702阅读
2评论
12.ElementElement:是饿了么公司前端开发团队提供一套基于 Vue 网站组件库,用于快速构建网页。Element 提供了很多组件(组成网页部件)供我们使用。例如 超链接、按钮、图片、表格等等~如下图左边是我们编写页面看到按钮,上图右边是 Element 提供页面效果,效果一目了然。我们学习 Element 其实就是学习怎么从官网拷贝组件到我们自己页面并进行修改,官网网
时间范围选择<template> <el-date-picker v-model="value" type="daterange" @change="handleDateChange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd">
Vue
原创 2021-07-12 10:20:07
356阅读
时间范围选择<template> <el-date-picker v-model="value" type="daterange" @change="handleDateChange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd">
原创 2022-02-28 16:35:57
356阅读
前言开发管理系统时使用框架没有拖拽表格列功能,简单实现一个组件现在将列拖拽部分拆分出来,有需要可以各自优化一下下载相关依赖使用了elementui,拖拽使用了vuedraggable可以自行更换npm install element-ui npm install vuedraggable实现原理调用拖拽api实现拖拽效果,本文使用了vuedraggable插件将拖拽列传递给子组件显示利
原创 2024-02-29 09:30:22
855阅读
vue项目中引入element ui1.安装element ui1. 安装 Element-UI 模块 npm install element-ui --save2.在main.js中全局引入element uiimport ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(E
目录vue源码系列之 响应式数据处理2 数组重写vue源码系列之 响应式数据处理1 链接: link.array.js对数组方法进行重写 oldArrayPrototype 原始数组方法arrayMethos = Object.create(oldArrayPrototype) 创建一个新对象,也就是拷贝原始数组方法methods 中方法,是会影响原始数组,因此需要重写这些方法
前戏 前面我们已经搭建好了首页一个大概样式,现在我们就来使用ElementUI搭建头部
原创 2022-07-07 10:42:33
598阅读
创建导航页组件 在components目录下新建一个navigation目录,在Navi目录中新建一个名为Navi.vue组件。至此我们目录应该是如下图所示: 然后我们修改main.js文件,修改后文件如下 我们可以看到render函数参数由之前App变为我们新创建Navi组件。从此我们
原创 2021-09-26 17:28:17
1511阅读
 创建导航页组件在components目录下新建一个navigation目录,在Navi目录中新建一个名为Navi.vue组件。至此我们目录应该是如下图所示:  然后我们修改main.js文件,修改后文件如下import Vue from 'vue'//import App from './App'import router from './router'import ElementUI f
转载 2021-06-12 16:14:00
193阅读
2评论
目录为什么要封装组件应用场景vue自己封装组件(局部、全局) Vue组件三要素①全局组件1)方式: 2)示例:②局部组件1)方式:2)示例:命名规范:(注意)脚手架vue-cli中组件父传子(props)通过 $on 传递父组件方法$parent获取父组件然后使用父组件数据(不推荐)通过$emit传递父组件数据 (推荐) refs获取组件样式修改 样
Vue作为一个轻量级前端框架,它核心就是组件化开发。Vue是由一个一个组件构成,各个组件实例作用域之间相互独立,就造成了不同组件之间数据不能相互引用。然而,在实际开发中,需要访问其他组件数据时,就有了组件之间数据传递问题。Vue组件之间关系有:父子关系、兄弟关系、隔代关系。那他们之间是怎样进行数据传输,这就是接下来要讲述问题。1.父组件给子组件传值: 方案:使用自定
Vue动态组件 文章目录Vue动态组件一.背景1.v-if动态加载2.v-show动态加载二.动态组件1.动态组件实现2.keep-alive 状态保持2.1 被keep-alive缓存组件特点2.2 keep-alive更多属性设置2.2.1 include 包含2.2.2 exclude排除2.2.3 max 允许最大缓存数量,默认无限制 一.背景Vue 中提供有一个内置组件叫做 com
前言如项目中有一个产品分类树形组件,在分类属性组件中引入之后,要实现点击左侧 component) this.$e
原创 2023-03-06 11:15:55
226阅读
作者: jeffrey_hjf 是一个目前比较流行前端框架,在业界也算很有名气,今天这里为大家罗列一下基于Vue后端管理框架。 使用这些框架你会发现它包括了我们常用路由,状态,交互等等,我们只需要去复用它代码,加上一下我们自己少量逻辑就能轻松完成项目。 会为你节约更多时间喝喝咖啡等,给你一种“框架在手,天下我有”感觉。这篇文章主要介绍element和V
转载 2024-03-07 15:23:07
237阅读
环境要求NodejsNodejs官网下载地址:://nodejs.cn/
原创 2022-03-29 11:24:07
582阅读
?欢迎观阅本本篇文章,我是Sam9029 文章目录⭐前言场景需求具体思路?源码 (Vue-组合式API)?源码解读?效果演示拓展说明?欢迎查阅Sam9029 其他文章 ⭐前言在Vue开发中,遇到了搜索框输入防抖处理,算是防抖使用场景之一吧,抽象其逻辑记录下来以备后用场景需求作为开发人员,一定要先搞清楚场景需求是什么场景需求:搜索输入时 ,判断用户在输入完成后 实现即时自动搜索 并且要防止过度
前言因项目的需要,而且当前组件库并不支持业务,所以,重新对日历组件进行封装。该篇博客就对实现日历思路进行存档,方便以后查阅。先上图:UI小哥哥原型图。接下来思路都是根据该图进行解说逻辑1.组件拆分,分出哪些是业务,哪些是基础组件。 整体来说,这就是在日历基础上添加业务,所以日历组件应该是基础组件,而业务应该是通过插槽插入进去。那么,右上方分入分出合计以及每个日历中分入,分出都是需
常见组件封装使用vue create green-ui命令初始化一个vue项目勾选如下选择scss选择eslint风格选择保存时校验选择In package.json保存输入项目名创建项目成功启动项目然后把App.vue修改为如下内容<template> <div id="app"> 定制组件 </div> </template>
转载 2024-04-21 13:45:24
217阅读
  • 1
  • 2
  • 3
  • 4
  • 5