首先,要大概知道webpack是什么,webpack的插件都是做什么用的,vue是什么,然后看完之后也可以去补充一下这些方面的知识。第一步:安装环境 需要安装的有:nodejs,并添加入环境变量PATH使用nodejs安装vue-cli  参考内容: http://cn.vuejs.org/guide/installation.html#u547D_u4EE4_u884C_u
转载 3月前
379阅读
 一.表单输入绑定1.数据的双向绑定    v-model  指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定<!DOCTYPE html> <html lang="zh-CN"> <head&gt
这里写目录标题小记笔记一、项目初始化1、初始化2、安装webpack3、引入并使用vueWebpack的基本配置基本配置文件配置loader写几个小栗子栗子一栗子二栗子三栗子四栗子五练手实例小记这里有篇讲Vue的博客,挺不错的,参考:笔记一、项目初始化1、初始化首先使用vscode快捷键打开当前文件夹下的命令行Ctrl + `运行npm init -y生成package.json文件 在项目中需要
转载 3月前
0阅读
// 更新于 2019-10-15:在实际开发过程中,发现以下的写法比较累赘,因为在后面的项目中,继续优化表单验证的方法,让代码更简洁。主要的修改是验证方法的修改和调用以前验证表单字段的最大长度,description: [{ max: 200, message: '最大长度为200个字符', trigger: 'blur' }]现在写法:description: [validateLen(200
转载 2024-03-03 23:30:53
531阅读
1.vue2-manage此项目是 vue + element-ui 构建的后台管理系统,是后台项目node-elm 的管理系统,所有的数据都是从服务器实时获取的真实数据,具有真实的注册、登陆、管理数据、权限验证等功能。项目地址:https://github.com/bailicangdu/vue2-manage 2.Cloud-AdminCloud-Admin(开源项目) Cloud-Admin
Vuetify利用表单验证规则,简化表单验证及错误信息提示的实现背景一般前端的登录功能都需要写表单验证,一个方面需要写验证规则,限制用户输入;另一方面需要写验证错误的错误提示信息,提高用户的体验度。效果演示传统方式实现弊端但是如果用原生的H5和js来写,会发现需要写的操作很麻烦,而且都是重复性的操作。无非就是给表单写失去焦点事件,然后进行判断,如果失败,给一个div从display:none设置为
 引言今天用到了一个加载更多的插件,用起来很方便,插件的名字叫做vue-infinite-scroll我们可以去npmjs.com官网看一下这个vue-infinite-scroll的用法,官网上面写的已经很简单易懂的了。 安装npm install vue-infinite-scroll --save 引入官网介绍了三种引入该插件的方式,分别是Common js方式
转载 2024-05-29 19:17:34
202阅读
一、Form组件二次封装考虑组件构成:form组件:input text passworldselectcheckboxradio文本域日期二、实现Form表单的二次封装:1. 分析出对应的位置 开始抽离组件2. 如果需要产生多个form表单,则需要产生多个el-form-item,则需要一个数据来循环渲染form-item3. 结合form表单属性继续分析:label   
 实现效果:(可拉代码下来看:vue-demo: vueDemo)左侧表格为点击查询调用接口查询出来的数据,右侧表格为左侧表格所有选择的数据,由前端实现分页。 两个el-table勾选数据联动更新 实现逻辑:el-table表格的selection-change方法(element组件的table表格)结合分页组件,自定义一个用于存储(左侧表格)当前的已勾选数据;一个用于存储所勾
网页右边,向下滑有目录索引,可以根据标题跳转到你想看的内容如果右边没有就找找左边运行效果:分片上传,已经上传过,如果丢失某些分片,会自动续传,已经上传完成,会直接跳过,完成秒传本文适合做过全栈开发的同学,最起码需要会vue+spring boot的前后端环境搭建,以及基本的前后端交互逻辑,否则你是听不懂的,最起码是做不了测试的如果你只是前端工程师,那么自己mock模拟响应就可以了此博客是学习b站u
前言最近Vite2.0很火热,说是要替代webpack作为下一代前端构建工具。上个周末搬完房子仔细研究了一下,照着我们目前的项目环境,尝试搭建了一套基础环境,简单了解了Vite2.0的配置,以及各种库的集成。这里对Vite2.0不做过多的介绍,主要优点就是快,快,快。环境配置一条命令创建一个空的vite项目npm init @vitejs/app vite-project在终端,输入以上命令,会让
转载 9月前
115阅读
Vue3-ElementPlus使用
原创 5月前
63阅读
背景:  首先声明一下,我只是个菜鸡,为了解决问题才去看的源码,解决完问题之后也就没有兴趣看其他部分代码了,所以这篇文章是一次很低层次的解读,角度也相当片面,想必会有很多喷点吧。  事情的经过是这样,今年十月底的时候对公司前端产品的构建工具做了一次升级,从webpack1升级到了webpack4,现在已经投入正式环境,写这篇文章的时候我在外边出差,忙的时候997,闲的时候也997,这会儿就有点闲得
转载 10月前
68阅读
1. 前端框架的发展历史前端工程师 12. html css + div 13. js 加入 jquery 14. MVC angular1.0 react 15. vue 微信小程序2. Vue.js第一次使用什么是框架?什么是库(框架是有一套自己的生态系统的 库是没有自己的生态系统的, 它就是一个工具)Vue.js是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以
转载 10月前
44阅读
官网地址:https://element-plus.gitee.io/zh-CN/
原创 2023-02-25 11:13:44
164阅读
1点赞
前言大文件快速上传的方案,相信你也有过了解,其实无非就是将 文件变小,也就是通过 压缩文件资源 或者 文件资源分块 后再上传。本文只介绍资源分块上传的方式,并且会通过 前端(vue3 + vite) 和 服务端(nodejs + koa2) 交互的方式,实现大文件分块上传的简单功能.梳理思路问题 1:谁负责资源分块?谁负责资源整合?当然这个问题也很简单,肯定是前端负责分块,服务端负责整合.问题 2
转载 7月前
32阅读
前言上一篇文章写了:「后端小伙伴来学前端了」分析Vue脚手架结构简单说明了Vue的脚手架结构,但是上篇文章还欠了个小点没有说完,就在这篇文章中补齐。就是所谓的render函数。一、main.js中引入的原来是残缺版vue.js我们来接着看看main.js这个入口文件。// 引入vue import Vue from 'vue' // 引入app组件 import App from './App.v
转载 7月前
59阅读
vue基础1、下载vue.js vue官网:https://cn.vuejs.org/v2/guide/ 直接下载文件 2、引用:跟引入jquery一样,利用script标签映入 3、使用:let vm=new Vue({ el:"", data:{ } })4、基础属性el :element(元素) 字符串类型 用于选择元素,类似css的选择器,#id名、.class名data: 对象类型
tips: 可使用原子化CSS减轻代码量// 自定义样式 import '@/styles/index.scss';body {
原创 精选 2024-04-13 22:00:02
211阅读
1评论
下载element-admin框架点击该地址:https://github.com/PanJiaChen/vue-element-admin用git clone https://github.com/PanJiaChen/vue-element-admin或者直接下载压缩包都可以       2.安装依赖打开项目根目录,在根目录
转载 2024-03-04 15:16:17
2294阅读
  • 1
  • 2
  • 3
  • 4
  • 5