![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
VUE
文章平均质量分 78
尘世壹俗人
做一只马喽
展开
-
如何用vue的v-for写出控制步长的循环
整体的思路是用栅格el-row做最外层的for载体,内部用ul做行内元素的展示载体,大家可是按需使用其他的标签,但是无论如何都免不了最外层会生成多个无用的for载体标签。但这貌似没有解决的办法,属于vue的缺陷,如果大家有解决的方法,可以评论说一下。最近碰到一个需求有意思的需求,前端用的vue,但是需要再for遍历集合的时候控制步长,每次处理两个元素。,而不是向jsp中的forEach那样单独的标签,这意味这它的使用需要一个载体。原创 2023-05-04 21:37:31 · 887 阅读 · 0 评论 -
知识点14--vue-axios与element ui配合示例
前面几篇知识点已经被大家介绍了vue的element和axios,但是只是在各自介绍时顺带着有两个demo,并不是很全面,本篇使用两个模块一起开发几个功能demo,帮助大家在理解上更容易一点,项目沿用知识点13在知识点13的项目中,我们将前后端分离模块式开发,并使用两者展现了一个列表,下面我们在当前列表页面下,再扩展几个功能demo我们使用element的对话框功能实现添加,其实就是bootstrap的模态框第一步:使用我们前面知识点说过的普通布局组件以及在合适的地方配合按钮组件准备一个添加用户的按钮,并在原创 2022-07-16 18:40:53 · 835 阅读 · 0 评论 -
知识点13--vue-axios
我们平常自己开发一些小demo或者研究些前后端技术的时候,我们通常为了方便是前后端写在一个项目里,当然我们也可以前后端分开写,写成父子项目,这就是正式开发时,所用的手段,但是大家如果前后端交互主要用的技术就是HTML和jquery,那开发起来就很顺畅,但是大家此刻想一想,我们用的是vue,你怎么和后端交互呢?用form表单吗?还是用ajax?貌似都不是一个最优解,而且在vuecli项目时form表单能不能正常用还是两说,ajax你需要jquery更不要想了,所以本章要为大家介绍一个vue为我们准备的前后端交原创 2022-07-12 18:35:56 · 359 阅读 · 0 评论 -
知识点12--在vuecli项目的基础上用npm方式使用element ui
知识点11中介绍了如何使用vuecli搭建项目,那么本章知识点为大家介绍如何在vuecli搭建的项目中使用npm下的element ui第一步:你需要在那个项目中cmd窗口下,切换到项目路径下第二步:在项目路径下使用命令为当前项目安装element ui第三步:下载完成后,你就可以在项目的package.json配置文件中看到element ui的版本信息了第四步:在项目的main.js文件中加入如下代码,引入完整的element ui除了全部引用,你也可以单个的引用,见官网这时你就可以正常使原创 2022-07-11 19:05:42 · 476 阅读 · 0 评论 -
知识点11--使用vuecli的方式搭建一个项目
在前面的知识点,我使用的是离线下载vue.js,甚至在使用element UI的时候,我也是直接采用的官方引用,从未给大家演示过如何使用vue client去搭建一个项目,最根本的原因是因为要使用client的方式需要一个node.js环境,这个东西它是一个JavaScript引擎,一个基于谷歌v8浏览器而派生的环境,如果大家用过es,那就应该熟悉node,因为它是es-head连接工具的必备品,可是这个环境本身他有很多问题,他版本相当多,但是能用的版本基本没几个,真的是纯粹要靠经验来积累哪个版本能用的一个原创 2022-07-10 18:05:39 · 645 阅读 · 0 评论 -
知识点10--element ui
本章介绍一个前端渲染框架叫,是一个基于vue开发的组件库,它就相当于jquery的插件,不过它的作用和CSS的Bootstrap有些类似,具体更详细的了解大家可以去官网看一看你可以把它理解成一个含有CSS样式能力的渲染框架,后面给大家演示的时候一看就能明白,它本质上就是在单一的样式上加入了渲染效果,分为css和js两块代码,这是vue近些年在前端为什么这么火的原因,因为培养成本低,这就和python语言在人工智能领域很火一样,本质上并不是语言或框架的本身有多优秀,而是这个框架或语言对于企业来说,用人或培养成原创 2022-07-09 17:07:55 · 1567 阅读 · 0 评论 -
知识点9--零散知识点串讲
从本篇知识点开始,不再纯粹讲解vue的东西,因为它本身也是从原生js封装上来的,和jquery是同等的地位,而且有很多都是一些共性的东西,可以说你有jquery的基础在了解一些vue的开发方式其实大致上就八九不离十了,所以为了防止看知识点的朋友专注于vue而忘了它的本质仍然是js,本篇知识点开始往后整体上,不再单纯的讲解vue特性,而且vue没有多少单独的东西,往后的知识点会整体上多讲一讲开发中常用到的一些要点,不止有vue还有js本身自带的特性,本篇顺带着讲一些零碎的东西箭头函数vue的箭头函数其实就是j原创 2022-07-07 15:31:26 · 145 阅读 · 0 评论 -
知识点8--组件
Vue的组件说的很高大上,它其实本质上就是造了一个有自定义功能的标签元素,而且分和,全局组件使用Vue静态属性去构造,局部属性在vue对象中构造,且局部属性只生效在vue对象所绑定的元素中全局组件如下方式构造效果局部组件,如下在vue实例对象中构造效果如下:总体来说,要想正常的使用自定义组件,除了定义组件的代码正确之外,还要注意只有被vue实例化对象绑定的标签中才可以正常调用组件,而局部和全局的区别就在于局部变量只有在该组件被声明的vue对象所绑定的标签中生效其他标签中不会生效.........原创 2022-07-07 14:53:19 · 125 阅读 · 0 评论 -
知识点7--表单绑定
不知大家是否用过一个前端样式框架叫做Bootstrap,该前端框架提供了一种可以绑定的表单,达到的最终目的是通过CSS绑定Class属性为from-group的div中的一个input标签和一个文本标题,保持他们的对齐提供友好的展示效果而vue的这个表单绑定和Bootstrap有一点类似,但是它的目的不一样,下边通过demo具体看一下它能干什么,注意用的vue的表单绑定用的是第一种:当绑定主体为input标签时,可以将input的内容与一个文本标签绑定截图无法完全展示效果,但是大家实际操作后可以发现,绑定原创 2022-07-07 14:14:33 · 422 阅读 · 0 评论 -
知识点6--条件渲染与列表渲染
条件渲染其实就是前端的条件判断,早先的jsp标签库提供过if的标签,vue也同样有这样的功能,不同的是,vue是使用模板指令完成的效果如下在前端指的是,是地址对比,是赋值,不要再这一点上疑惑,vue它本身也是原生js封装来的,jquery能用的东西vue一般也是通用的,不要以为vue超然世外了除了if渲染之外,条件渲染还提供了渲染,它的作用是直接决定一个标签元素是否被展示,这一点可以直接实现,不过这里还是说一下大家要知道有这么一个模板指令是专门用来完成是否渲染的效果如下这里说一下在是否渲染上用和原创 2022-07-07 12:38:05 · 603 阅读 · 0 评论 -
知识点5--vue对多样式的增强
在我们日常的开发中,时常会遇到不同样式之间切换,在jquery框架中,我们可以通过固定方法修改属性值,而在vue中,所以我们提供了一种增强型的法,使我们可以为一个标签设置多个值的同时且控制不同的值是否生效从上面的代码可以看出这种增强写法,是依赖了模板指令使得有多个class属性的预选值,当然这种增强写法也可以用在其他地方下面我们看效果,当时当时......原创 2022-07-07 00:12:22 · 201 阅读 · 0 评论 -
知识点4--模板指令语法
我们可以在官网上查看什么是模板语法:第一种最常见的模板语法就是,就是前面知识点用到的在元素中声明变量,后面通过Vue的data参数赋值,但是文本插值时Vue提供了一个指令,使用它的元素在初始化后将不会有任何值的改变第二种模板语法是,它的作用是将动态的html代码生效,具体作用如下当我们有如下代码,且目的是希望动态的插入一个html标签时改代码运行后效果并不理想,因为它会把标签以字符串的格式插入如果我们想达到目标,需要使用指令,告诉Vue的该标签的结果赋值给元素上我代码中的写法可能大家会看的有些别扭原创 2022-07-06 18:54:54 · 298 阅读 · 0 评论 -
知识点3--钩子函数
Vue为开发者提供了一个钩子函数,其实就是为开发者提供了一个在dom被渲染的生命周期中,某些特别时间段嵌套自定义代码的功能,如果没有听懂这句话,大家可以想一下CSS为我们提供的针对超链接的点击前点击后样式开发,和那个意思一模一样看控制台输出上面的六个钩子函数我们要做一个了解,而且在实际使用中患有另外的两个组件相关的钩子函数,用到再说......原创 2022-07-06 18:16:14 · 298 阅读 · 0 评论 -
知识点2--数据追踪和书写格式
vue的脚本中一般使用的形式操作渲染,而我们通常会将该对象赋值给一个变量做后续的操作比如在上一个知识点中我们创建了第一个vue的demo,同时用使用app变量去接收了它,而本篇知识点中我们稍作修改其实Vue对象的data参数存在的意义是对元素内容初始化的同时,保证对数据后续的响应追踪我们来体验一下什么叫响应追踪,可以看一下效果,现在的效果如下但如果我们后面修改了某一变量的数据,则Vue对象会追踪到变化,并同步该值一般情况下我们很乐意让vue去追踪数据的响应,但是不需要的时候我们只需要使用Vue提供的原创 2022-07-06 17:49:28 · 351 阅读 · 0 评论 -
知识点1--初识vue
vue和jquery其实是一样的东西,都是通过原生js,也就是JavaScript封装出来的框架,我们平常说的js通常是jquery框架,而vue是另外一种和jquery同等地位的一个渐进式框架,它的好处就是体积小,运行快,所以通常使用在一些微服务或者是对前端渲染速度要求较高的web项目上vue之所以快,原因是它底层使用了虚拟dom处理,dom大家应该都知道是原生js的前端元素对象,所谓的虚拟mod,其实就是vue对我们操作mod的动作作了优化,将我们的操作优化成了最优解在实际开发中使用vue,有两种方式原创 2022-07-06 16:34:04 · 140 阅读 · 0 评论