Vue
文章平均质量分 51
厚积而薄发1528
纵化大浪中,不喜亦不惧。应尽便须尽,无复疑多虑。
展开
-
前端web在线PPT编辑器-PPTLIST
一个基于 Vue3.x + TypeScript 的在线演示文稿(幻灯片)应用,还原了大部分 Office PowerPoint 常用功能,支持 文字、图片、形状、线条、图表、表格、视频、音频、公式 几种最常用的元素类型,每一种元素都拥有高度可编辑能力,同时支持丰富的快捷键和右键菜单,力求还原桌面应用级体验。支持导出本地 PPTX 文件,支持移动端基础编辑和预览。您可以在此基础上搭建自己的在线幻灯片应用:原创 2024-07-07 00:08:16 · 355 阅读 · 0 评论 -
vue3 form 报错: please transfer a valid name path to form item
最近vue3着实很火,但很多伙伴在用的时候发现很多坑,比如说上面这个报错please transfer a valid name path to form item!为什么会出现这个问题呢,我是在使用antd的动态增减表单(循环)的时候报了这个错误,搞了很久才找到根本原因。原因:你的formItem的name属性没有和数据输入(input)框关联起来,导致表单规则校验一直报错解决方法:因为出现这种场景很多,所以这里提供几个注意事项,大家可以依次检查一下。1.检查formItem的na原创 2022-03-17 16:46:31 · 6835 阅读 · 17 评论 -
vue实现div可拖动位置也可改变盒子大小
以下是效果图:实现了div盒子在固定区域的拖动,也可改变盒子的高度和宽度,当超出边距后无法继续改变大小这里说一下大致原理:拖动和改变大小是分开来操作的,接下来分别说一下盒子拖动这里用到了js的三个鼠标事件,分别是onmousedown(鼠标按下)、onmousemove(鼠标移动)以及onmouseup(鼠标松开),大致流程就是鼠标按下拖动图标进行拖动时,动态获取当前div的left和top再重新赋值给当前div的top、left值,当鼠标松开再清除事件,至于固定在某个区域内拖动,在赋值的时原创 2020-09-16 09:51:54 · 7349 阅读 · 3 评论 -
draggable拖拽组件使用
项目开发中需要用到拖拽组件,因为前端技术框架是vue,这里就使用了vue的一款拖拽插件vue.draggable,一般基本的需求都能满足,这里使用了多个draggable嵌套,达到两级之前相互拖拽的功能。以下是类似teambition的效果图片,最外层为一个draggable,可以左右拖动,然后每个块里面还有小块,小块组成一个draggable,可以上下拖动,也可以在大的块之间拖动。这里说一下实现原理。首先,要搞清楚draggable的api,这里提供以下博主自己发现的一个vue.dra..原创 2020-08-27 10:20:42 · 33167 阅读 · 13 评论 -
vue实现两个区域滚动条同步滚动
项目开发中,遇到一个比较两个form差异的需求,但当item过多就需要滚动条,这里就用到了滚动条同步的地方,其实原理和git的差异比较差不多,这里来做一下分析。原创 2020-07-14 18:03:00 · 8352 阅读 · 10 评论 -
template的作用
vue开发中经常会用到template,这里记录一下他的作用:template的作用是模板占位符,可帮助我们包裹元素,但在循环过程当中,template不会被渲染到页面上原创 2020-07-03 11:50:42 · 3283 阅读 · 0 评论 -
v-for遍历数组和对象
vue初学者在使用v-for属性时可能不能区分数组遍历和对象的遍历,这里做一个记录:v-for指令是用来遍历 数组、对象以及整数的,下面依次讲解遍历数组 v-for最常用的可能就是用来遍历数组,接受两个参数(item, index),item为遍历出的每组数据,index为每组数据的索引,可做唯一标识<div id="demo" <el-span v-for="(item, index) in array" :key="index"> {{index}...原创 2020-07-03 09:06:07 · 10214 阅读 · 1 评论 -
vue学习资源分享
一下总结了些vue学习过程中的文档、文章、项目以及视频。文档&社区 Vue.js官方网站(中文) Vue论坛 vue-router 组件库 文章 《Vue.js:轻量高效的前端组件化方案》 《Vue.js 和 Webpack》(一)(二)(三) 《尤小右采访》作者的采访有一些设计理念 腾讯全端 AlloyTea...原创 2019-10-18 15:41:30 · 342 阅读 · 0 评论 -
vue 自定义验证规则rule只能为数字
vue中自定义rule进行校验input框只能为数字vue<el-input v-model="age" maxlength="3"/>js const isNum = (rule, value, callback) => { const age= /^[0-9]*$/ if (!age.test(value)) { c...原创 2019-04-19 10:54:35 · 38743 阅读 · 3 评论 -
创建Vue项目
1、安装vue-cli打开cmd: (-global:全局安装)npm install --global vue-cli2、创建项目:cmd打开项目工作空间(test为项目名)vue init webpack test然后终端会出现一问一答模式:这里有几个需要说明一下,没说明的直接回车选择默认就好,对项目没多大影响:“Project name”:这个是项目名称,默认...原创 2019-04-08 11:21:19 · 422 阅读 · 0 评论