目录前言思考实践filterPane.vue明确目标传入数据结构整理timeSelectelinputelselect开始封装tablePane.vue明确目标传入数据结构整理toolcolspageDataoperationtablePane.vue配置项Cols详解开始封装实战结尾前言由于重构后台管理项目中有好多表格页面, 举个栗子这表格看着还挺好看,写
......
328
0
0
2023-06-16
目录Vue3中watch的详解Vue2使用watchVue3使用watch情况1情况2情况3情况4情况5特殊情况Vue3中watch的详解Vue2使用watch<template>
<div>总合:{{ sum }}<button @click="sum++">点击累加</button></div&
......
338
0
0
2023-06-16
目录基础用法禁用状态尺寸继承原生 input 属性可清空密码框 show-password带 Icon 的输入框文本域可自适应高度文本域复合型输入框总结源码地址本篇文章将为我们的组件库添加一个新成员:Input组件。其中Input组件要实现的功能有:基础用法禁用状态尺寸大小输入长度可清空密码框带Icon的输入框文本域自适应文本高度的文本域复合型输入框每个功能
......
447
0
0
2023-06-15
目录一、前言二、主要功能三、功能实现四、实现效果 总结一、前言 接到公司需求,要做一个可拖拽的甘特图来实现排期需求,官方的插件要付费还没有中文的官方文档可以看,就去找了各种开源的demo来看,功能上都不是很齐全,于是总结了很多demo,合在一起组成了一版较为完整的满足需求的甘特图。二、主要功能1.拖拽 拖拽功能是甘特图的主要功能
......
474
0
0
2023-06-15
目录本文内容最终效果图组件html布局穿梭框左侧内容穿梭框右侧内容穿梭框中间向左、向右按钮把排序好的穿梭数据传给父组件整体代码小结本文内容需求是实现类似 el-transfer的组件,右侧框内容可以拖动排序;手写div样式 + vuedraggable组件实现。最终效果图组件html布局新建一个组件文件 CustormTransfer.vue,穿梭框 htm
......
263
0
0
2023-06-15
目录VUEX使用详解01-vuex基础-介绍02-vuex基础-初始化和基本使用03-vuex基础-state04-vuex基础-mutations05-vuex基础-actions06-vuex基础-getters07-vuex基础-modules08-vuex案例-新闻(预习)重点总结VUEX使用详解01-vuex基础-介绍组件共享数据/通信的方式有哪些
......
252
0
0
2023-06-14
目录1. 什么是分片上传2. 上传组件模板3. 上传组件逻辑3.1 基本思路3.2 选择上传文件3.3 校验文件是否合法3.4 文件加密3.5 合并文件3.6 文件切片上传4. 参考文章4.1 文章链接4.2 参考文章提到的注意事项4.2.1 nginx 上传大小限制4.2.2 大文件下载总结1. 什么是分片上传将 一个文件 切割为 一系列特定大小
......
536
0
0
2023-06-13
目录一、概念1. Pinia => Pinia2. Pinia和Vuex的对比二、使用Pinia1. 安装2. 创建Pinia3. 在main.js中引入三、Store1. 概念2. 创建3. 使用4. 效果 四、核心概念State1. 定义State2. 读取写入State3. 重置State4. 改变State5. 替
......
392
0
0
2023-06-13
目录概要基本例子设计动机逻辑组合与复用类型推导设计细节setup() 函数组件状态为什么需要包装对象?Ref Unwrapping(包装对象的自动展开)配合手写 Render 函数使用WatchersWatcher 回调的调用时机生命周期函数依赖注入类型推导纯 TypeScript 的 Props 类型声明复杂 Props 类型缺点/潜在问题升级策略附录Cl
......
239
0
0
2023-06-12
目录前端1、添加路由2、添加页面元素3、添加请求后端1、添加路由2、添加函数当今前端世界最流行的三个框架Vue,React,Angular。这三个框架可谓是各有千秋,可以满足不同场景的需求。我们这套实践分享内容主要是使用Vue框架,这个框架上学习起来非常容易,很容易上手。相对React陡峭的学习曲线,Vue显得格外简单和友好。好了,选好了框架后,我们还需要选
......
378
0
0
2023-06-12
目录前言1、 props / $emit2、ref / $refs3、eventBus事件总线($emit / $on)4、依赖注入(provide / inject)5、$parent / $children6、$attrs / $listeners总结1、父子组件间通信2、跨代组件间通信3、兄弟组件间通信4、任意组件间通信前言组件是 vue.js最强大的
......
286
0
0
2023-06-12
目录一、概述二、使用方式三、完整版vm.$mount的实现原理四、只包含运行时版本的vm.$mount的实现原理这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助一、概述在我们开发中,经常要用到Vue.extend创建出Vue的子类来构造函数,通过new 得到子类的实例,然后通过$mount挂载到节点,如代码:<div id="mount-p
......
306
0
0
2023-06-12
目录表单控制购物车案例v-model进阶(了解)vue生命周期与后端交互电影案例表单控制1.input:checkbox(单选,多选),radio(单选)2.代码展示<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-">
&
......
305
0
0
2023-06-12
目录1. 思路1.1客户端1.2服务器2.服务器2.1创建数据2.2创建接口3.客户端3.1创建静态页面3.2请求数据3.3解析逻辑4.总结1. 思路1.1客户端利用vue相关的知识搭建基本页面,上面四张图片,下面是分页器基本效果静态显示。点击分页器实现不同数据请求,显示不同图片1.2服务器根据客户端发送的数据进行数据分段传输,比如,点击的是那一页分页器每次
......
286
0
0
2023-06-11
目录前言Pinia与Vuex的区别使用Pinia直接修改数据的两种方式使用actions修改数据重置state中数据Pinia持久化存储Pinia模块化实现Pinia中store之间互相调用总结前言Pinia官网介绍说:Pinia 是 Vue 的存储库,它允许您跨组件/页面共享状态。Vuex同样可以作为状态管理工具,那么两者有什么区别呢?Pinia与Vuex
......
464
0
0
2023-06-11