随笔分类 -  前端

js中表单验证中的任务执行顺序初探
摘要：在写线上运维平台中的表单处理逻辑时，遇到困扰的地方 //验证表单 checkForm(){ return new Promise((resolve, reject) => { var checkResult=true this.$refs['businessInfo'].validate((vali 阅读全文
posted @ 2020-07-28 19:50 西橙 阅读(259) 评论(0) 推荐(0)
通过引用组件实现做菜单栏
摘要：前端样式 使用了iview的布局组件 控制左菜单栏的前端主父组件代码 <template> <div id="Home"> <Layout :style="{minHeight: '100vh'}" > <Sider collapsible :collapsed-width="78" v-model 阅读全文
posted @ 2020-07-15 10:20 西橙 阅读(281) 评论(0) 推荐(0)
列表过滤功能
摘要：功能场景：从后端获取所有的数据并渲染到表格后，需要对这些数据进行查找筛选 实现的前端demo input标签绑定数据 keyword <Row> <Col span="4"> <Input v-model="keyword" search enter-button placeholder="输入关键 阅读全文
posted @ 2020-07-14 21:15 西橙 阅读(321) 评论(0) 推荐(0)
mac 安装vue 调试插件：vue-devtools
摘要：下载项目到本地某个目录下vue-devtools项目地址 解压后进入到目录执行 npm install npm run build 将其添加到chrome的扩展程序 点击选择shells/chrome 即可导入成功 重启chrome，打开自己的项目就可以看的vue插件 阅读全文
posted @ 2020-07-14 20:23 西橙 阅读(1557) 评论(0) 推荐(0)
vue 报错：please transfer a valid prop path to form item
摘要：前端项目编译报如下错误，这两处其实是一处的报错 查看第二处报错信息中对应的getProByPath函数 可以大概知道是解析prop属性指定的路径时找不到触发的报错，由于prop是用于设置一些规则的属性 所以遇到这种报错就需要看下代码中prop指定的路径是否在rules中存在 我触发报错的原因是因为表 阅读全文
posted @ 2020-07-13 21:04 西橙 阅读(6581) 评论(0) 推荐(0)
vue 表单验证由异步变更为同步
摘要：写前端项目时vue表单验证突然变成异步了，导致如果获取校验函数的返回值，应该是升级iview组件导致的，这里记录一下改为同步的一种写法 实现功能：表单中进行规则设置，当触发提交或者流程中的下一页时触发这些规则校验 表单 <Form ref="businessInfo" :model="busines 阅读全文
posted @ 2020-07-08 17:22 西橙 阅读(2101) 评论(0) 推荐(0)
vue 实现从后端获取数据渲染选择框
摘要：前端环境：vue 使用的vue 组件：iview 后端项目框架：beego 实现功能：从数据库中读取数据绑定到选择菜单栏 前端定义请求的路由地址 文件：src/api/demands.js // 获取集群列表 export const getClusterList = ()=>{ return Si 阅读全文
posted @ 2020-06-30 17:35 西橙 阅读(3625) 评论(0) 推荐(0)
vue项目重编译失败
摘要：问题触发背景 本地测试项目没有问题后上传到gitlab，然后拉到测试机上开始npm run dev，结果报错 解决方法 项目根目录下创建文件：postcss.config.js module.exports = { plugins: { 'autoprefixer': {browsers: 'las 阅读全文
posted @ 2020-06-24 14:42 西橙 阅读(1203) 评论(0) 推荐(0)
iview 动态实现增减输入框
摘要：前端模版 要点说明（仅是自己在调试中总结的个人理解，非官方，认知有限） v-model是用来绑定数据的，和数据结构中的字段名保持一致，否则无法取得数据 prop和和v-model的字段名相同，由于这里是动态生成input标签，所以prop属性也应该是动态的，因为rules是根据prop来校验的，所以 阅读全文
posted @ 2020-06-14 17:45 西橙 阅读(1654) 评论(1) 推荐(0)