2022年6月3日
重读vue电商网站18之监听图片删除事件
摘要： Js // 处理图片移除的操作 handleRemove(file) { // 1.获取将要删除的图片的临时路径 const filePath = file.response.data.tmp_path // 2.从pics数组中，找到这个图片对应的索引值 const idx = this.addF 阅读全文
posted @ 2022-06-03 22:16 前端导师歌谣 阅读(46) 评论(0) 推荐(0)
重读vue电商网站17之监听图片上传成功事件
摘要： 阅读全文
posted @ 2022-06-03 22:16 前端导师歌谣 阅读(30) 评论(0) 推荐(0)
重读vue电商网站16之Upload 上传组件
摘要： Js <!-- action表示图片上传后台api地址 --> <el-upload :action="uploadURL" :on-preview="handlePreview" :on-remove="handleRemove" list-type="picture" > <el-button 阅读全文
posted @ 2022-06-03 22:16 前端导师歌谣 阅读(90) 评论(0) 推荐(0)
2022年6月2日
重读vue电商网站1之后台启动
摘要： 后台数据接口启动文件 node -app.js 需要mysql数据库 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(52) 评论(0) 推荐(0)
重读vue电商网站2之前台启动
摘要： 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(23) 评论(0) 推荐(0)
重读vue电商网站3之登录页面总结el-form 组件问题
摘要： el-form 组件默认是 content-box，我们设置其如下属性时，就会出现长度比我们想象中长一点的情况。 .login_form { position: absolute; bottom: 60px; width: 100%; padding: 0 20px; //多加一行 box-sizi 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(46) 评论(0) 推荐(0)
重读vue电商网站4之登录页面总结使用 iconfont 给输入框添加图标
摘要： 在 main.js 中导入字体图标 然后在 el-input 组件中通过 prefix-icon 进行相关图标引用 最终效果图如下： 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(120) 评论(0) 推荐(0)
重读vue电商网站5之登录页面总结如何进行表单验证
摘要： Form 组件提供了表单验证的功能，只需要通过 rules 属性传入约定的验证规则，并将 Form-Item 的 prop 属性设置为需校验的字段名即可。 通过 rules 属性传入约定的验证规则 将Form-Item 的 prop 属性设置为需校验的字段名 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(57) 评论(0) 推荐(0)
重读vue电商网站6之如何重置表单
摘要： element-ui 对表单提供了如下方法 resetFields，我们只需要获取表单对象数据即可重置我们的表单。 获取表单对象方式如下： 直接在表单处添加 ref属性，如下 loginFormRef，此引用即为我们表单实例。 然后，在我们重置按钮处，通过 @click 给按钮绑定一个事件 下一步， 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(159) 评论(0) 推荐(0)
重读vue电商网站7之登录预校验
摘要： 在我们点击登录按钮，不应该直接发起网络请求，而是应该对表单进行预校验，检验成功才会发送请求。 拿到表单引用对象，即可进行对表单的校验。 首先，给登录按钮通过 @click 来绑定一个事件 下一步，在 methods 中添加 login 方法，validate函数参数为一个回调函数。该回调函数会在校验 阅读全文
posted @ 2022-06-02 21:12 前端导师歌谣 阅读(57) 评论(0) 推荐(0)