vue-个人杂记

Vue-父子组件传值

一、父组件向子组件传值通过属性props因为父组件在模板中或者控制的区域要使用子组件，可通过属性直接赋值1.在子组件中声明props属性定义要接收数据的属性名称2.父组件在使用子组件标签时通过动态绑定对应的属性进行赋值(传值)3.那么在子组件中模板内可以随便使用该属性，使用方式和Data中的变量数据一样！△△△:定义props属性的时候可以使用[]数组形式定义[‘msg’,‘arr’]，也可以使用
MrLss·2022-04-03 13:41

vue-动态切换组件 （点击事件，切换页面）

效果直白讲：点击事件，切换页面例子：假设是在App组件里，有两个button按钮，点击button1显示一个页面，点击button2显示另个一页面。步骤：这个是正常上下组件所展示的界面这个是点击按钮发生页面跳转的效果步骤：另一种方法:路由跳转步骤：前端路由底层的逻辑就是监听hash地址的变化，用到window.onhashchange事件这里的使用的是箭头函数。箭头函数里面的this和外边的thi
studyer网·2022-04-03 07:48

vue-组件详解

VUE-组件component一.定义二.组件的使用1.定义组件2.组件的分类全局组件局部组件3.template的三种写法-1.字符串模板写法-2.
el violeta·2022-04-01 02:29

vue-批量导入文件篇（一）

序言在我们创建路由的时候，会发现如果所有的路由都在一个文件内，那么当项目路由多的时候，就会出现路由难找，路由跟路由不在一块等情况出现（没维护好）。所以，为了避免这种情况，我们可以使用模块化这种思想来解决问题。那么，问题就来了，当模块多的时候，一个个的导入就很浪费时间，需要重复引入-赋值这一过程，所以，我们是不是能让程序来帮我们做这一步骤呢，那么我们岂不是可以愉快玩耍了。一、webpackrequi
·2022-03-29 11:42

编程相关知识

重要Python-数据处理Golang-后端Nodejs-后端react-前端vue-前端Kotlin-安
账房先生2016·2022-03-28 13:26

vue-好看的版本更新记录

vue-好看的版本更新记录更新历史名称内容版本1.0创建时间2021-10-26更新时间2021-10-26功能清单基于vue、element实现版本更新日志的显示基于json文件记录更新日志最终效果集成流程拉取
mt23·2022-03-19 07:50

vue中vm.$set函数的使用

$set改变对象的属性1.使用场景(原因)VUE-响应式2.不是响应式的例子{{"num"}}-{{item}}exportdefault{name:"",data(){return{list:[1,10,11
苏Sue酥·2022-03-18 21:51

浅析vue-router中history模式

路由初始化本次学习使用的是vue-
辛巴德2018·2022-03-18 03:33

Vue3.2+Vite2.x+Typescript项目基础搭建

TypeScript中文网Vue3中文文档创建项目使用开发工具为：VisualstudioCode全局安装vitenpminstall-gcreate-vite-app创建项目命令：npminitvite依次选择vue
无我_无他_有你·2022-03-08 15:35

（六）Vue-模板编译和组件化

模板编译模板编译的主要目的是将模板(template)转换为渲染函数(render)vue-template-explorerVue2.6把模板编译成render函数的工具vue-next-template-explorerVue3.0beta把模板编译成render函数的工具模板编译过程编译的入口src\platforms\web\entry-runtime-with-compiler.js组件
JerrySi·2022-03-06 21:48

（四）Vue-渲染过程

Vue的不同构建版本完整版：同时包含编译器和运行时的版本。编译器：用来将模板字符串编译成为JavaScript渲染函数的代码，体积大、效率低。运行时：用来创建Vue实例、渲染并处理虚拟DOM等的代码，体积小（小大约30%）、效率高。基本上就是除去编译器的代码。UMD：UMD版本通用的模块版本，支持多种模块方式。vue.js默认文件就是运行时+编译器的UMD版本。CommonJS(cjs)：Comm
JerrySi·2022-03-06 21:19

vue-尚品汇项目 -尚硅谷项目笔记-项目配置

2.1项目运行起来时，让浏览器自动打开在项目根目录下的package.json文件里面的scripts里面的serve后面加上--open"scripts":{"serve":"vue-cli-serviceserve--open","build":"vue-cli-servicebuild","lint":"vue-cli-servicelint"},2.2eslint校验功能关闭—在根目录下，
懒啦·2022-03-05 12:02

vue原理初探

负责服务端渲染的包vue-server-renderer、配合vue-loader使用的vue-template-compiler，还有weex相关的│├──vue-server-renderer│├──vue
·2022-02-28 17:04

Vue-学习笔记-07 v-for详解

文章目录一、当我们有一组数据需要进行渲染时，我们就可以使用v-for来完成。二、v-for遍历数组三、v-for遍历对象四、v-for的key五、Vue当中数组的响应式一、当我们有一组数据需要进行渲染时，我们就可以使用v-for来完成。v-for的语法类似于JavaScript中的for循环。格式如下：iteminitems的形式。二、v-for遍历数组{{item}}{{index+"---"+
疯狂的地球人·2022-02-27 17:31

Vue-学习笔记-06 v-if详解

文章目录一、Vue中的v-if和v-show1.1v-if决定是否渲染基本使用：1.2v-show决定是否显示1.3v-if和v-show的区别1.4v-if根据成绩返回评价二、小案例点击切换登录的类型一、Vue中的v-if和v-showv-if、v-else-if、v-else这三个指令与JavaScript的条件语句if、else、elseif类似。Vue的条件指令可以根据表达式的值在DOM中
疯狂的地球人·2022-02-27 17:31

vue-小细节

一、浏览器参数行为参数1、不传但是用参数接收@click="xxx"xxx(event){}2、多个参数($event)@click="xxx(abc,$event)"xxx(param1,event){}
hush_Pc·2022-02-25 11:42

vue-小细节以及小知识点

系列文章目录提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加例如：第一章Python机器学习入门之pandas的使用提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录系列文章目录前言一、nextTick()？前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的
webberQian·2022-02-25 11:11

Vue-生命周期&数据共享-总结

1.生命周期&生命周期函数生命周期（LifeCycle）是指一个组件从创建->运行->销毁的整个阶段，强调的是一个时间段。生命周期函数：是由vue框架提供的内置函数，会伴随着组件的生命周期，自动按次序执行。注意：生命周期强调的是时间段，生命周期函数强调的是时间点。3.组件生命周期函数的分类4.生命周期图示可以参考vue官方文档给出的“生命周期图示”，进一步理解组件生命周期执行的过程：https:/
程序猿向前跑·2022-02-22 13:19

php++仿网页版微信,vue+web端仿微信网页版聊天室功能

二、技术框架•MVVM框架：Vue2.5.6•状态管理：Vuex•页面路由：Vue-
目楚·2022-02-21 07:32

Vue-打包提测

改三个地方，1，build->utils.js，添加publicPath:'../../'image.png2，config->index.js，修改assetsPublicPath:'./',注意加点image.png3，src->router->index.js，运行history，打包hashimage.png
WhereRiseFrom·2022-02-19 13:37

vue- v-for

Document索引值：{{i}}---每一项：{{item}}//创建Vue实例，得到ViewModelvarvm=newVue({el:'#app',data:{list:[1,2,3,4,5,6]},methods:{}});
AssertDo·2022-02-19 10:11

vue-滚动条

功能简介功能比较简陋，仅实现了主要功能，水平滚动条，垂直滚动条，容器高宽改变时动态更改滚动条的大小，自定义颜色，方位等功能可通过添加配置参数实现一、需要安装“element-resize-detector”npminstallelement-resize-detector用于监听div宽高变化二、创建工具类util.js，方便事件的绑定以及移除/***绑定事件**@export*@param{an
青青草原灰太狼·2022-02-15 03:30

前端项目开发流程（附思维导图PC）

是否完成安装,通过win+R输入cmd按回车打开命令行,看到版本号表示安装成功npm配置一下淘宝镜像:npmconfigsetregistryhttps://registry.npm.taobao.org执行vue
楚君君·2022-02-14 13:10

vue-使用js-xlsx导出数据到EXCEL表格

首先，安装三个依赖包：npminstall-Sfile-saver（生产依赖，则为-s）npminstall-Sxlsxnpminstall-Dscript-loader（开发依赖，则为-d）我们在src目录下新建一个文件夹，例如vendor，然后把：Blob.js和Export2Excel.js两个文件（可以去网上找这两个文件）放在该文件夹下，在Export2Excel.js文件中我们引入：/*
过往深处少年蓝·2022-02-14 10:12

vue-列表动画

实现列表动画li{border:1pxdashed#999;margin:5px;line-height:35px;padding-left:5px;font-size:12px;width:100%;}li:hover{background-color:hotpink;transition:all0.8sease;}.v-enter,.v-leave-to{opacity:0;transform
跌倒的小黄瓜·2022-02-12 06:22

Vue-初试水（四）

1、导航栏路由使用router属性必须要加上，才能使用vue本身的路由如果要使用data中传入的值，则在el-menu-item中index属性的使用就变成:index的写法，如果直接使用index，则是无法使用data中的值如果不用data中的值而直接固定写的话，就是属性写法，直接把：干掉，index自带属性来写：2、在Vue中进行分层布局1、首先先把局布准备工作布置好，先有个型2、之后引入要布
·2022-02-10 10:20

Vue-初试水（三）

1、vue调用后端接口，并展示在前端列表中前端列表中需要的数据为tableData:此处访问后端接口获取此处的数据前提构造tableData数据，次数据结构为数组：从后端获取到数据后，要进行多个数据遍历的话，则使用foreach进行数据的遍历，及通过push方法传入tableData中data.forEach(element=>{this.tableData.push({name:element.
·2022-02-10 10:19

Vue-初试水（二）

1、VUE调用后端接口并展示有有npm，之后对于整个项目的安装工作变得容易，只需要下载工具包，导入，引用，三步骤即可：今天的主题是他axiosnpminstallaxios--save一般通用的包都直接引入在main.js中之后的套路就是引用，之后找一个页面直接引用，引用的样子如下，人家结构就长这样，class引用下面的js，click调用方法，一连串操作2、Vue中ElementUI的使用也就是
·2022-02-09 16:24

Vue-初试水（一）

1、Vue安装1、vue可以通过npm下载生成项目，此处所以首先安装的是nodejs，这里的关系就是npm是nodejs里面的一个小弟，所以此处依赖nodejsnpminstallvuenpminstallvue-cli--vue脚手架npminstall--globalwebpack--打包新建项目vueinitwebpacka-project运行项目npmrundev运行执行的是dev里面的配
·2022-02-09 12:03

vue开发（一）使用vue-cli搭建项目

安装方式慢，国内建议使用cnpm，输入以下命令npminstall-gcnpm--registry=https://registry.npm.taobao.org（更多关于cnpm淘宝镜像）二、全局安装vue
努力努力再努力jy·2022-02-06 23:12

vue-组件

组件组件的创建方式第一种//1.1使用Vue.extend来创建全局的Vue组件//varcom1=Vue.extend({//template:'这是使用Vue.extend创建的组件'//通过template属性，指定了组件要展示的HTML结构//})//1.2使用Vue.component('组件的名称',创建出来的组件模板对象)//Vue.component('myCom1',com1)/
跌倒的小黄瓜·2022-02-06 01:10

VUE-自定义指令

有的情况下，需要对普通DOM元素进行底层操作，这时候就会用到自定义指令。举个聚焦输入框的例子，如下：el与data的两种写法当前的n值是：当前的n值是：点我n+1varapp=newVue({data:{n:1,},//这种写法写起来简单，但是不可以处理细节directives:{//big函数合适被调用1、指令与元素成功绑定时(绑定时只是建立关系，页面还没出现)会调用(一上来)，2、指令所在的模
zsyyyyy·2022-02-06 01:00

Vue-生命周期

所有的生命周期钩子自动绑定this上下文到实例中，因此你可以访问数据，对属性和方法进行运算。这意味着你不能使用箭头函数来定义一个生命周期方法创建=>beforeCreatecreated挂载=>beforeMountmounted请求数据获取元素更新=>beforeUpdateuptdated优化销毁=>beforeDestorydestoryedbeforeCreate在实例初始化之后a数据观测
stringtoString·2022-02-05 21:29

vue-三种过度属性

一.transition结合css实现过渡1.将你想添加过渡效果的元素使用transition包含2.必须为这个transition设置名称，这个名称就是你后期的过渡样式的前缀，意味着后期的样式就是以这个名称做为前缀的3./*添加过渡样式，这个样式的前缀就是之前transition标签中定义的name*/出现.name-enter{开始}.name-enter-active{过渡}.name-en
vzii·2022-02-05 05:46

Vue-修饰符

.sync修饰符假设有以下场景，爸爸给儿子钱，儿子要花钱规则：组件不能修改props外部数据this.$emit可以触发事件，并传参$event可以获取$emit的传参//儿子的Props里有moneyexportdefault{props:["money"]};爸爸：//绑定儿子的money属性//引入儿子组件importChildfrom"./Child.vue";exportdefault{
Shigure_Rain·2022-01-21 19:14

vue-前端分页和后端分页

1：前端手写分页(数据量小的情况下)前端需要使用slice截取：tableData((page-1)pageSize,pagepageSize)clipboard.pngclipboard1.png2：后端分页，前端只需要关注传递的page和pageSize了，这里就不一一赘述了3：前端手写分页按钮window.onload=function(){//1s内只允许发送请求(出发事件)一次(可多次点
You_d39d·2021-12-30 22:11

Vue-一些常用的工具类

本文介绍一些常用的工具类1.验证码如下图，一般的后台管理系统都会在登录的时候设计一个验证码，这个验证码是前端生成的，点击canvas可以切换验证码。二维码的类型是数字或者字母自己可以根据需要设置，1.验证码的js如下图，首先引入验证码的jsverifyCode的代码如下，自己根据需要修改长宽（_init方法中的宽和高），验证码的类型，颜色，干扰线等。functionGVerify(options)
·2021-12-21 18:04

vue.js打包项目后页面出现空白的解决办法

./”即可，vue-cli3的话要稍微麻烦些，因为vue-
·2021-11-30 17:58

解决vue-seamless-scroll滚动加点赞衔接处数据不同步问题

$refs.seamlessScroll.reset()表示重置意思到此这篇关于解决vue-
·2021-11-24 13:40

vue-脚手架安装流程

webpack自己配置环境繁琐官方提供脚手架,快速搭建项目基础结构概念脚手架是为了保证各施工过程顺利进行而搭设的工作平台在代码里的体现,就是一套固定标准的,文件夹+文件+webpack配置好处开箱即用0配置webpackbabel支持css,less支持开发服务器支持准备安装@vue/cli全局模块包,得到Vue命令,以后创建Vue脚手架项目步骤全局安装@vue/cli模块包yarnglobala
·2021-11-13 21:53

Vue-处理\n无法换行的问题

问题描述在开发Vue的组件时，总会遇到大段文本的组件，此时，如果该大段文本作为参数时，那么文本的换行符（\n）却无法正常换行，而是被替换为空格。解决方法我们可以利用css样式中的white-space，把文本区域的样式设置为：white-space:pre-line;，就可以很方便的解决。注意不要使用white-space:pre-wrap;，该样式会把前后空格也保留了，会出现对齐异常。拓展知识w
·2021-10-26 18:08

Vue 团队公开快如闪电的全新脚手架工具 create-vue，未来将替代 Vue-CLI，才300余行代码，学它！

极力推荐之前我写的《学习源码整体架构系列》包含jQuery、underscore、lodash、vuex、sentry、axios、redux、koa、vue-devtools、vuex4、koa-compose、vue
·2021-10-26 14:14

Vue 团队公开快如闪电的全新脚手架工具 create-vue，未来将替代 Vue-CLI，才300余行代码，学它！

极力推荐之前我写的《学习源码整体架构系列》包含jQuery、underscore、lodash、vuex、sentry、axios、redux、koa、vue-devtools、vuex4、koa-compose、vue
·2021-10-26 13:07

Vue 实现穿梭框功能的详细代码

Vue-实现穿梭框功能，效果图如下所示：css.transfer{display:flex;justify-content:center;align-items:center;}.transfer>.list
·2021-10-22 18:00

vue-监视的原理

文章目录vue是怎样监视数据改变的（原理）：**vue监听的特点（好处）：**vue监听的注意事项（坏处）：1.监听对象2.监听数组vue是怎样监视数据改变的（原理）：就是把我们代码中写的data，通过一定的转换，成为vm中的vm_data这个转换就是，给每个元素新增加了get，set方法其中set方法，还有重新加载的功能（响应式），就是一旦被调用了set(元素被改变)，就重新加载页面vue监听的
'Han'Zi·2021-10-17 21:35

3.uniapp项目中引入小程序ui -vant weapp组件

vue-
静昕妈妈芦培培·2021-10-07 17:05

Vue-事件绑定on

使用方法v-on:事件=”方法名“@事件=“方法名”【跟上面是一样的，只是上面的简写】传递参数1.@事件=“方法名（参数1，参数2）”2.对应的方法：方法名:function(参数1,参数2){alert("你是"+参数2+参数1)}限定事件1.@事件.限制条件=“方法名”例如：@keyup.enter="ke"
'Han'Zi·2021-09-14 14:23

Vue-(2)模板语法

前言文本Html属性表达式指令参数用户输入过滤器修饰符示例：{{name}}{{age}}岁{{site}}{{url}}{{des}}exportdefault{name:"测试测试惺惺惜惺惺",data(){return{site:"响彻天堂",url:"https://www.jianshu.com/p/89e200d6ac60",des:"来学习，分享~",}},created(){thi
物非0人非·2021-09-03 11:58

Vue-(1)介绍和安装

前言Vue一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。Vue的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。更多学习Vue，可以去看。兼容性Vue不支持IE8及以下版本，因为Vue使用了IE8无法模拟的ECMAScript5特性。但它支持所有兼容ECMASc
物非0人非·2021-08-24 15:03

vue时间线组件的使用方法

本文实例为大家分享了vue时间线组件的具体实现代码，供大家参考，具体内容如下效果vue-时间线组件（时间轴组件）代码{{t.date}}{{t.title}}{{t.content}}importVuefrom'vue'exportdefaultVue.component
·2021-08-11 13:12
上一页 7 8 9 10 11 12 13 14 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他