Vue学习笔记

vue学习笔记--非props特性和props特性

props是用来接收父组件数据的，子组件不可以直接更改props接收的数据，即单向数据流概念。一、非props特性：1.子组件未通过props接收，不能显示在dom上；image.pngimage.png2.子组件模板内直接写入内容而非插值表达式，会显示在dom最外层标签上image.pngimage.png二、props的特性概括为父组件传，子组件接,dom标签内直接用image.png1、pr
一个总在代码里给自己下毒的小白·2021-06-24 20:33

Vue学习笔记-起步

写在最前：自学笔记，往后逐步添加笔记内容一、通过TodoList案例起步提交/*Vue.component('TodoItem',{//全局组件props:['content'],//父组件向子组件传值template:`{{content}}`,//模板组件内容})*/varTodoItem={//局部组件props:['content','index'],//接收父组件传入的值template
没名字的某某人·2021-06-22 12:05

vue学习笔记（3）——router

githubvue学习笔记（1）主要介绍vue项目的创建vue学习笔记（2）主要介绍项目的基本设置，如axios设置和项目颜色控制今天讲解vue一个很重要的组件router，熟悉后台开发的人肯定对router
溪语流沙·2021-06-22 01:33

vue学习笔记

vue对比jqueryvue：mvvm数据驱动影响视图适用于复杂数据jquery：mvc视图塞入数据适用于复杂视图动效生命周期以下都是钩子函数beforeCreate（创建前）created（创建后）beforeMount(载入前)mounted（载入后）beforeUpdate（更新前）updated（更新后）beforeDestroy（销毁前）destroyed（销毁后）计算属性compute
34sir·2021-06-21 08:15

后端小白程序员的Vue学习笔记

文章目录写在前面Vue一、什么是Vue二、相关技术栈前端后端关于前后端分离三、入门使用3.1、Hello,Vue3.2、Mustache语法3.3、插值操作3.4、属性绑定v-bind3.5、条件插值3.5.1、v-if、v-else、v-else-if3.5.2、v-show3.5.3、使用key来管理复用元素3.6、列表渲染v-for3.6.1、遍历数组3.6.2、遍历对象3.6.3、v-fo
5akura·2021-06-19 20:44

Vue学习笔记（一）

跨域问题vue前端跨域问题1.利用vue-cli框架与axios结合，访问服务器后端接口，axios不需要太多配置，如下图asiox配置2.主要需要配置vue的config文件夹下的idnex.js文件，如下图vue的config配置后端Springboot配置springboot后端配置只需要增加一个过滤器即可，网上也有很多，此处不负赘
我有的似乎只能是等待等待·2021-06-19 11:26

Vue学习笔记-引入Echarts图表

近期，公司出了一个新需求，我们需要开发一个数据统计平台，于是就需要使用图表来是数据更直观的呈现。Echarts是我们的首选。重点：用较少的代码实现比较酷炫的数据统计表.ECharts，一个使用JavaScript实现的开源可视化库，可以流畅的运行在PC和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖轻量级的矢量图形库ZRende
赵客缦胡缨v吴钩霜雪明·2021-06-18 23:58

VUE学习笔记：15.模块化开发之webpack使用配置文件打包

1.webpack使用配置文件打包我们前面讲的webpack打包命令webpack待打包的文件打包后的文件是以参数的形式来指定打包的入口文件和出口文件，这种方式不够灵活。在项目中我们更常用的方法是：将打包的相关信息写在配置文件中。webpack的配置文件为：webpack.config.js文件。（1）基本实现使用配置文件打包还是以前面的案例来进行讲解：新建webpack.config.js文件如
new nm个对象·2021-06-13 18:27

VUE学习笔记：14.模块化开发之webpack简介，安装及基本使用

1.什么是webpack2.webpack安装webpack要运行需要依赖于node环境，所有我们需要先安装node。如何使用node中的包管理根据npm来安装webpack第一步：安装node：https://nodejs.org/zh-cn/当执行以下命令成功时，表示安装完成。第二步：更改镜像源地址为淘宝镜像（类似于阿里云的maven中央仓库镜像）#安装npminstall-gcnpm--re
new nm个对象·2021-06-13 16:50

VUE学习笔记：13.模块化开发之：为什么需要模块化，CommonJS，ES6中的模块化（了解）

1.前端代码复杂带来的问题2.CommonJS(了解)3.es6中的模块化（1）导出（2）导入
new nm个对象·2021-06-12 22:39

VUE学习笔记：12.组件化之：slot组件插槽讲解

1.为什么需要使用slot我们自定义的组件往往需要在很多不同的页面中使用。而且在不同的页面中使用时，组件也不是一成不变的，而是同一组件在不同地方使用时展示的内容也稍有不同。要实现以上需求就不能在定义组件时把展示的内容写死，而是在组件中定义出插槽。当我们在使用组件再决定组件具体需要展示哪些内容。一般在定义组件时，我们将共性的内容写死在组件中。而可能改变的内容封装为插槽。2.slot的基本使用在定义子
new nm个对象·2021-06-12 20:04

vue学习笔记

安装npminstallvue概述vue模板newVue({data:{a:1},created:function(){},})vue定义了许多系统自带的属性attribute,一般用$开头来访问，有一些常用的attribute:$root访问组件的根元素，如果没有根元素就访问自己$parent访问父组件的实例$ref定义子组件的ID引用，$refs引用所有的子组件ID//通过ref这个attri
09c9ae1d7f1d·2021-06-12 13:30

Vue学习笔记

Vue开发请求本地数据的配置早期的vue-lic下面有dev-server.js和dev-client.js两文件，请求本地数据在dev-server.js里配置，最新的vue-webpack-template中已经去掉了dev-server.js和dev-client.js改用webpack.dev.conf.js代替，所以配置本地访问在webpack.dev.conf.js里配置即可作者：山风
LeoCong·2021-06-08 03:31

Yan Ruyu_Vue学习笔记

YanRuyu_Vue学习笔记Vue基本认知Vue是一个JavaScript框架，它的特点在于使用者不用再思考DOM的操作，一切都由Vue来承担，这就是Vue的MVVM模式，使用Vue框架你只需要操作数据而不是
YuJianChi·2021-06-08 01:47

VUE学习笔记：4.vue的计算属性和v-on绑定监听事件

一.计算属性1.什么是计算属性2.计算属性的基本使用{{fullName}}//ES6中使用let定义变量，使用const定义常量letapp=newVue({el:'#app',//讲这个vue实例与id为app的标签关联起来data:{firstName:'zhang',lastName:'san'},//计算属性中的数据可以跟data中的数据一样使用，不过它的数据的值是通过方法的运算后得出的
new nm个对象·2021-06-05 23:35

VUE学习笔记：3.vue的插值操作及v-bind绑定属性

一.插值操作插值操作就是讲vue实例中的数据渲染到HTML页面标签的内容中。1.mustache语法mustache语法是在HTML页面中，需要使用vue数据的地方使用{{key}}的方式来获取vue中的数据的值。{{message}},张三{{firstName+""+lastName}}{{count*2}}{{firstName}}{{lastName}}//ES6中使用let定义变量，使用
new nm个对象·2021-06-05 17:37

VUE学习笔记

https://segmentfault.com/a/1190000012692321利用webpack创建一个VUE项目vueinitwebpack[projectName]npminstallnpmrundev/npmrunbuild关于MVVMMVVM，一种更好的UI模式解决方案MVVM===>M/V/VMM：model数据模型V：view视图VM：ViewModel视图模型开发中遇到的问题
周撒飞·2021-06-05 16:51

Vue学习笔记（一）

一、父子组价间的传值1.父组件传值给子组件在父组件中使用子组件时，可以通过直接在子组件中添加属性来给子组件传值，像下面这样importinnerHeaderfrom"../../components/innerHeader"exportdefault{name:"ip_ping_index",data(){return{current:'ICMP',btns:['ICMP','TCPing','H
许小花花·2021-06-05 00:17

VUE学习笔记：2.vue的选项(options)及生命周期

1.vue对象的常见选项(options)我们在实例化一个Vue对象后，会使用它的选项。如：el,data等。详细的讲解，参考文档：https://cn.vuejs.org/v2/api/#search-query-nav我们目前需要掌握以下几个选项：2.vue的生命周期每个Vue实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到DOM并在数据变化时更新DO
new nm个对象·2021-06-04 23:21

VUE学习笔记：1.初识vue.js

1.什么是vue.jsvue的官方网站：https://cn.vuejs.org/v2/guide/2.安装vue.js方式一：CDN引入方式二：下载到本地后引入前期我们使用这种方式。开发环境：https://vuejs.org/js/vue.js生产环境：https://vuejs.org/js/vue.min.js方式三：使用NPM安装新手不推荐这种方式。在学习到webpack和CLI时，必须
new nm个对象·2021-06-04 22:35

Vue学习笔记: Vue + Element-ui搭建后台管理系统模板

Vue学习笔记:Vue+Element-ui搭建后台管理系统模板技术：Vue+Element-ui功能：后台管理系统基础模板，路由配置，加载页面进度条,请求响应拦截器的封装等页面预览：后台管理系统模板代码
前端互助会·2021-06-04 10:30

Vue学习笔记之Vue安装

什么是Vue.jsVue是一套用于构建用户界面的渐进式JavaScript框架。与其他大型框架不同的是，vue被设计为自底向上逐层应用。Vue的核心库只关注视图层。Vue是典型的MVVM模型的框架。Vue不支持IE8以下版本，因为Vue使用了IE8无法模拟的ECMAScript5特性。Vue环境配置Vue安装直接用引入下载Vue对应的版本，通过进行引入；不下载Vue对应的版本，通过CDN访问对应的
Kity_Pei·2021-05-31 15:19

Vue学习笔记

part1简单指令的学习Document[v-cloak]{display:none;}{{msg}}:v-click:简写->@-->varvm=newVue({el:"#app",data:{msg:"123",msg2:"123456",mytitle:"这是自定义的title",},methods:{show:function(){alert(123);}},});运用简单指令实现一个走马
JackySei·2021-05-25 16:49

Vue学习笔记（二）组件化和模块化

Vue学习笔记（二）组件化和模块化前言组件化什么是组件化1、基础使用2、全局组件和局部组件3、语法糖和模板抽离4、组件的data为什么是函数5、父子组件5.1父子组件5.2父子组件通信5.2.1父传子值
Hi--Man·2021-05-21 15:31

vue学习笔记

vue引入vue.js第一个vue程序vue指令v-ifv-forv-bindv-bind缩写v-model.lazy.number.trimv-onv-on缩写v-htmlv-showv-show和v-if的区别计算属性应用Axios_ajax绑定htmlclass组件引入vue.js第一个vue程序vue{{message}}varapp=newVue({el:'#app',//el是元素el
向天再借500年·2021-05-10 12:23

Vue学习笔记01——Vue开发基础

一、Vue实例配置选项选项说明dataVue实例数据对象methods定义Vue中的方法components定义子组件computed计算属性filters过滤器el唯一根标签watch监听数据变化1.el唯一根标签在创建Vue实例时，el表示唯一根标签，class或id选择器可以用来将页面结构与Vue实例对象中的el绑定。{{name}}varvm=newVue({el:"#app",data:
小C好好干饭·2021-05-06 19:51

Vue学习笔记，快速入门文档

Vue学习笔记资源获取此文档有离线版本学习笔记，下载方式如下如果有CSDN积分的直接下载：https://download.csdn.net/download/qq_31384551/18271053没有积分的请使用网盘下载
聚繁大BUG·2021-04-30 15:19

VUE学习笔记008 v-for 遍历数组和对象

遍历数组characters：["aaaaaa","bbbbbbb","cccccccccc"]character+++++++++++++++++++++++++++++++++++++++++++++++++++++++++遍历对象users:[{name:"aaaaaaa",age:"10"},{name:"bbbbbb",age:"20"},{name:"ccccc",age:"30"},
梦想_15eb·2021-04-30 14:09

Vue学习笔记入门篇——组件的使用

本文为转载，原文：Vue学习笔记入门篇——组件的使用组件定义组件(Component)是Vue.js最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。
ChainZhang·2021-04-26 21:28

Vue学习笔记入门篇——数据及DOM

本文为转载，原文：Vue学习笔记入门篇——数据及DOM数据data类型Object|Function详细Vue实例的数据对象。
ChainZhang·2021-04-23 10:54

Vue学习笔记之列表渲染

上一篇：Vue学习笔记之条件渲染v-for在v-for块中，我们拥有对父作用域属性的完全访问权限。v-for还支持一个可选的第二个参数为当前项的索引。
aitality·2021-04-22 03:07

vue学习笔记--v-for循环标签页label并实现根据不同label表格切换

目标：用标签页组件实现点击不同标签显示表格内容，标签页内lable和表格数据都是循环得到的。效果如图：2.png首先实现pane循环出header。v-model="tabKey"是指默认选中首页，abel=""name=""，:key=""是循环出数据必不可少的，tabKey:'namekey',header:[{title:'首页',key:'agekey'},{title:'全部',key:
一个总在代码里给自己下毒的小白·2021-04-21 10:43

Vue 源码解析 - 模板编译

[TOC]Vue学习笔记Vue源码解析-主线流程Vue源码解析-模板编译Vue源码解析-组件挂载Vue源码解析-数据驱动与响应式原理模板编译前文在对Vue源码解析-主线流程进行分析时，我们已经知道对于Runtime
Whyn·2021-04-20 22:56

【Vue学习笔记】Vuex使用

vuex是干嘛的Vuex是用来进行公共数据方法管理的。即管理所有数据都能拿到的数据和方法vuex的核心state用于存储公共状态，也就是数据，可以理解为组件中的data，以对象的格式写入即可state:{counter:10}在任何组件中都可以用$store.state.counter来获取。但是尤大大只建议用此方法来获取，如果要想更改数据则必须通过mutations来进行操作，因为这样可以配合d
王德发饿死了·2021-04-19 13:50

Vue学习笔记

前言:学习B站UP主狂神说视频笔记整理视频链接概述Vue(读音/vjuː/，类似于view)是一套用于构建用户界面的渐进式JavaScript框架。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用（SPA）提供驱动官网:vue
TuYoooo·2021-04-15 17:13

Vue学习笔记（一）：基础知识

Vue介绍简介：Vue.js目前最火的的一个前端框架，三大主流前端框架之一。其余两个是Angular和React。Vue.js是一套构建用户界面的框架（一套完整的解决方案，对项目侵入性大，中途需要跟换框架则需要重构整个项目），只关注视图层，易上手，有配套的第三方类库。提高开发效率，帮助减少不必要的dom操作；双向数据绑定，通过框架提供的指令，前端只需要关注业务逻辑，不再关心dom如何渲染。MVVM
南极浮冰·2021-04-14 17:14

VUE学习笔记

VUE学习笔记一、环境安装使用脚手架搭建VUE项目二、使用vue-cli创建模板项目1、什么是vue-cli是vue官方提供的脚手架工具。脚手架工具简单讲就是自动将项目需要的环境、依赖等信息都配置好。
不染心·2021-04-02 22:36

Vue学习笔记：Element时间控件设置某一个日期禁止选择

Vue学习笔记：Element时间控件添加一段时间禁止选择需求：时间控件，当天之前禁止选择，某一个日期的之前时间禁止选择文档：代码实现：在时间控件上添加:picker-options="pickerOptions
前端互助会·2021-03-18 15:12

Vue学习笔记——one：Vue基础

Vue基础渐进式JavaScript框架声明式渲染->组件系统->客户端路由->集中式状态管理->项目构建官网：https://cn.vuejs.org/v2/guide/易用：熟悉HTML、CSS、JavaScript知识后灵活：在一个库和一套完整框架之间自如伸缩高效：20kb运行大小，超快虚拟DOM[vue官方文档]https://cn.vuejs.org/v2/guide/Vue基本使用步骤
默默花上开·2021-03-04 14:53

Vue 事件的$event参数=事件的值案例

'002',count:2},{id:3,name:'003',count:3},]}},methods:{updateProduct(value){console.info(value)}}}补充：vue
·2021-01-29 10:02

Vue学习笔记：vue的计算属性

==计算属性在处理一些复杂逻辑时是很有用的==♦什么是计算属性？可以对数据进行一些转换后再显示，或者需要将多个数据结合起来进行显示计算属性关键词：computed代码示例1{{message.split('').reverse().join('')}}代码示例1中的模板很复杂，且不容易看懂代码示例2原始字符串:{{message}}{{reversedMessage()}}-->计算后反转字符串:
·2021-01-29 03:45

Vue学习笔记：v-bind动态绑定style

■可以利用v-bind：style来绑定一些CSS内联样式■在写CSS属性名的时候，比如font-size---□可以使用驼峰式：==fontSize==---□或短横线分隔：=='font-size'==■绑定style的两种方式：对象语法，数组语法一、对象语法■style后面跟的是一个对象类型---→对象的key是CSS的属性---→对象的value是具体赋的值，值可以来自data中的属性{{
·2021-01-29 03:40

Vue学习笔记：vue的计算属性

==计算属性在处理一些复杂逻辑时是很有用的==♦什么是计算属性？可以对数据进行一些转换后再显示，或者需要将多个数据结合起来进行显示计算属性关键词：computed代码示例1{{message.split('').reverse().join('')}}代码示例1中的模板很复杂，且不容易看懂代码示例2原始字符串:{{message}}{{reversedMessage()}}-->计算后反转字符串:
·2021-01-29 03:32

Vue学习笔记：v-bind动态绑定style

■可以利用v-bind：style来绑定一些CSS内联样式■在写CSS属性名的时候，比如font-size---□可以使用驼峰式：==fontSize==---□或短横线分隔：=='font-size'==■绑定style的两种方式：对象语法，数组语法一、对象语法■style后面跟的是一个对象类型---→对象的key是CSS的属性---→对象的value是具体赋的值，值可以来自data中的属性{{
·2021-01-27 23:54

2021-01-06

Vue配置proxy疯狂的地球人2021-01-0512:52:5813收藏分类专栏：Vue学习笔记文章标签：vueproxy跨域ajax跨域问题devServer最后发布:2021-01-0512:52
weixin_46315812·2021-01-06 13:25

Vue学习笔记

前端页面的一个十分强大的在线可视化布局Bootstraphttps://www.bootcss.com/p/layoutit/#Twitter推出的一个用于前端开发的开源工具包一、Vue概述： Vue(读音/vju/,类似于view)是一套用于构建用户界面的渐进式框架，发布于2014年2月。与其它大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层（htmlcssjs，
天才小熊猫啊·2020-12-29 11:44

vue学习笔记

vue学习笔记搭建脚手架cli安装最新vuecli：npminstall-g@vue/cli安装：vueui该命令会自动打开你的浏览器,你要确保当前目录下没有其他项目,浏览器展示的页面如下：1.VueUI
甜甜的耶啵·2020-12-29 11:45

vue 不同条件展示不同页面_vue学习笔记--表格列中根据不同内容显示不同按钮

目标：在表格中，A列的数据显示不同，B列根据A列中不同的数据，再显示不同的按钮。如图：2.png分析一下，“状态”这一列，有不同的tag。操作这一列会根据“状态”这列“已注册”“未注册”去分别显示“注销账号”或者是“获取注册链接”。先做“已注册”“未注册”效果，tag实现不同的颜色，就是通过type属性实现的，,对于tag的type直接用三元表达式进行实现代码片段plainsize="mini":
weixin_39605296·2020-12-21 10:19

vue学习笔记（超详细）

文章目录一.Vue基础认识Vue.jsVue安装方式Vue的MVVM二.Vue基础语法生命周期模板语法创建Vue,options可以放什么语法综合v-onv-for遍历数组v-model表单绑定v-model结合radio类型使用v-model结合checkbox类型使用v-model结合select类型使用值绑定修饰符检测数组更新计算属性computed计算属性setter和gettercomp
fmk1023·2020-12-18 16:35

Vue学习笔记：Vue+elementUI 实现简单的表单提交

前言elementUI是我感觉还不错的一个前端框架，它构建了很多快速搭建板块，比如导航栏、分页、表格、时间/日期选择器等很多项目中常用的模块，可以快速应用开发。安装官方推荐使用npm的方式安装，它能更好地和webpack打包工具配合使用。npmielement-ui-S也可以通过unpkg.com/element-ui获取到最新版本的资源，在页面上引入js和css文件即可开始使用。开始：构建项目1
冬日里的那丝残阳·2020-12-04 13:35
上一页 6 7 8 9 10 11 12 13 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他