Vue学习笔记

基于vue.js官方文档及查阅多方资料整理vue学习笔记

vue学习笔记引入vue标签：需要下载官方vue.js版本，然后通过标签在**.html**文件里引入NPM：CDN：直接复制CLI命令行工具：直接创建.vue文件引入成功，在控制台会出现这两条警告：注意点
CV程序猿·2019-10-23 17:07

从零开始的vue学习笔记（八）

前言今天花一天时间阅读完VueRouter的官方文档的基础部分，简单的做一下总结和记录VueRouter是什么VueRouter是Vue.js官方的路由管理器，用于构建单页应用(SPA)。地址栏url的变化并不会去发请求去服务器取新的页面，而是按需加载局部组件，看起来就像无刷新一样。包括的功能包括：嵌套的路由/视图表模块化的、基于组件的路由配置路由参数、查询、通配符基于Vue.js过渡系统的视图过
西街二叔·2019-10-18 11:00

从零开始的vue学习笔记（七）

前言今天花一天时间阅读完vuex的官方文档，简单的做一下总结和记录Vuex是什么Vuex是一个专为Vue.js应用程序开发的状态管理模式，以前的符合“单向数据流”理念的示意图：它包含三个部分：state，驱动应用的数据源；view，以声明方式将state映射到视图；actions，响应在view上的用户输入导致的状态变化。当我们的应用遇到多个组件共享状态时，单向数据流的简洁性很容易被破坏：多个视图
西街二叔·2019-10-15 22:00

从零开始的vue学习笔记（六）

混入混入(mixin)提供了一种非常灵活的方式，来分发Vue组件中的可复用功能。简单解释就是把一个Vue组件中的内容提供给别的组件来用。例子：//定义一个混入对象varmyMixin={created:function(){this.hello()},methods:{hello:function(){console.log('hellofrommixin!')}}}//定义一个使用混入对象的组件
西街二叔·2019-10-14 14:00

从零开始的vue学习笔记（五）

单文件组件Vue.component来定义全局组件的缺点：全局定义(Globaldefinitions)强制要求每个component中的命名不得重复字符串模板(Stringtemplates)缺乏语法高亮，在HTML有多行的时候，需要用到丑陋的不支持CSS(NoCSSsupport)意味着当HTML和JavaScript组件化时，CSS明显被遗漏没有构建步骤(Nobuildstep)限制只能使用
西街二叔·2019-10-12 16:00

从零开始的vue学习笔记（四）

组件注册组件名Vue.component('my-component-name',{/*...*/})这里的my-component-name就是组件名，组件名的取法可以参考指南kebab-case写法（-连接单词）推荐的写法定义：Vue.component('my-component-name',{/*...*/})用法：PascalCase写法（单词首字母大写）Vue.component('M
西街二叔·2019-10-11 20:00

从零开始的vue学习笔记（三）

事件处理v-on指令监听DOM事件，并在触发时运行一些JavaScript代码，示例：Greetvarexample2=newVue({el:'#example-2',data:{name:'Vue.js'},//在`methods`对象中定义方法methods:{greet:function(event){//`this`在方法里指向当前Vue实例alert('Hello'+this.name+
西街二叔·2019-10-10 19:00

从零开始的vue学习笔记（二）

数据与方法当一个Vue实例被创建时，它将data对象中的所有的属性加入到Vue的响应式系统中。data的数据和视图同步更新。实例创建后添加一个新的属性，对这个属性的的改动将不会触发任何视图的更新。如果需要一个属性，但是一开始它为空或不存在，仅需要设置一些初始值。Object.freeze()方法可以阻止修改现有的属性除了数据属性，Vue实例还包含实例属性与方法，前缀为$，例如：vm.$data，v
西街二叔·2019-10-10 14:00

vue学习笔记

开始：引入vue包varapp=newVue({el:'#app',绑定id或者classdata:{},//所有计算属性都以函数的形式写在computed李})v-if:比较用的v-html:把写的以html格式表示出来v-bind:绑定HTML属性如idclass缩写“:”v-on:绑定事件监听器缩写：“@”v-bind绑定class:1：可以与普通class共存改变false和true确定是
前端切图仔·2019-10-10 10:39

从零开始的vue学习笔记（一）

前言项目要用vue.js，今天开始自学vue.js官方教程，记录下自己的学习摘要，方便后面查阅Vue.js是什么Vue是一套用于构建用户界面的渐进式框架，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用(SPA)提供驱动。安装直接引入直接下载开发版的
西街二叔·2019-10-08 17:00

Vue学习笔记(4)-带参数路由，嵌套路由，编程式导航

路由传参明确使用场景：后期很多业务可能需要传递参数，如编辑时需要传递ID如果在路由配置中添加参数设置{name:'Product',//添加路由的参数配置,参数的标识就是://id这个名称你可以随意，它就相当于一个形参，它所影响不是你如何传递参数，而是后期如何获取参数path:'/product/:id',component:Product}在调用路由的时候的格式水果获取路由参数通过$route可
Sauron831·2019-09-22 01:00

Vue学习笔记整理-长期更新

从入门到实战1、Vue.js第1章Vue常用指令学习2、Vue.js第2章钩子函数&自定义指令&过滤器&计算属性&侦听器3、Vue.js第3章axios&Vue过渡动画4、Vue.js第4章组件与路由5、Vue
Sauron831·2019-09-21 01:00

Webstorm中配置Vue开发环境详解

Vue学习笔记1-windows系统搭建VUE环境我们用vue-cli创建好一个项目，如果我们使用Webstorm作为编码工具，会发现代码中有很多编辑器警告，这是因为默认情况下Webstorm对Vue项目的支持不够造成的
牧云流·2019-09-18 11:44

CSDN日报190906：Linux fork隐藏的开销-过时的fork；Vue学习笔记

CSDN日报来啦！给大家奉上当日最新鲜的技术干货！操作系统|Linuxfork隐藏的开销-过时的fork(正传)作者：dog250fork是一个拥有50年历史的陈年系统调用，它是一个传奇！时至今日，它依旧灿烂。一个程序员可以永远不用read/write，也可以不懂mmap，但必须懂fork。这是一种格调！fork没有参数，它是如此简单，是UNIX哲学的布道者或者说卫道者们的首选，它被写进了几乎每一
CSDN官方博客·2019-09-06 14:15

一、vue学习笔记：vue-cli3创建vue项目，并配置路由

文章目录1、安装nodejs2、查看版本号：2.1配置npm在安装全局模块时的路径和缓存cache的路径（可选操作）2.2、npm常用命令2.2.1、安装2.2.2、npm更新、卸载2.2.3、npm查看命令2.2.3、其他3、安装@vue/cli遇到的问题：3.1使用```vueui```来创建项目3.2初始界面3.3创建新的项目3.4手动选着需要那些插件支持3.4.1各个插件的功能3.4.2界
miracleo_·2019-09-03 21:17

Vue学习——搭建脚手架（mac版本）

Vue学习笔记—搭建脚手架一、mac安装vue-cli脚手架1.1需要准备的环境Homebrew：Mac系统下的包管理器，类似于linux的apt-get,Windows的控制面板-安装删除应用程序Node.js
咸鱼超人-·2019-08-31 17:05

Vue学习笔记

入门data:用于定义属性methods用于定义的函数{{}}用于输出对象的属性和函数的返回值当vue实例被创建时,它向vue的响应式系统中加入其data对象中能找到的所以属性当这些属性值发生改变时,html视图也会发生相应的变化模板语法文本:{{}}vue测试{{message}}{{test()}}{{message2}}newVue({el:"#app",data:{message:"Hel
JaminYe·2019-08-20 09:00

Vue学习笔记_新手报错整理

报错：vue.js:634[Vuewarn]:Propertyormethod"w"isnotdefinedontheinstancebutreferencedduringrender.Makesurethatthispropertyisreactive,eitherinthedataoption,orforclass-basedcomponents,byinitializingtheproper
橙橙鲁·2019-08-12 14:36

Vue学习笔记

学习Vue的一系列文章，主要是参考官方文档，同时结合自己的一点点心得体会整理而成有不足之处还请多多指正，下面先附上Vue的官方文档：教程：https://cn.vuejs.org/v2/guideAPI：https://cn.vuejs.org/v2/api/风格指南：https://cn.vuejs.org/v2/style-guide/Cookbook：https://cn.vuejs.org
wsmrzx的博客·2019-08-07 09:00

vue-js获取input输入值---vue学习笔记

{{getStr}}获取varvm=newVue({el:'#app',data:{str:'初始值',getStr:null,},created:function(){//thecreatedhookiscalledaftertheinstanceiscreated},computed:{},methods:{btnClick:function(){this.getStr=this.str.to
秦浩雷·2019-08-01 21:52

vue学习笔记

(1)父子组件的使用：*父和子，使用的父组件，被用的是子组件*父需要引入子组件然后声明子组件import子组件对象from'./xxx.vue'----引入子组件.......在javascript中.....{components:{组件名称：子组件对象}}(2)全局组件的使用*在main.js中引入一次；----import组件对象from'./xxx.vue';*vue.component(
bzuld·2019-08-01 15:53

VUE学习笔记——基础

VUE学习笔记第一部分：基础知识vue的基本认识vue的基本使用模板语法计算属性和监视class与style绑定条件渲染列表渲染列表的搜索和排序事件处理表单事件的自动收集VUE的生命周期动画过滤器指令第一部分
喝啤酒的猫·2019-07-27 16:59

Vue学习笔记

文章目录Node.jsVue简介Node和NPM下载Node.jsNPMdemo双向绑定v-model:数据模型事件处理v-on:事件名=js表达式生命周期函数指令插值表达式花括号插值闪烁v-text和v-htmlv-modelv-on基本用法事件修饰符按键修饰符组合按钮v-for遍历数组数组角标遍历对象keyv-if和v-show基本使用与v-for结合v-elsev-showv-bind（渲染
dustdawn·2019-07-24 23:42

Vue学习笔记（三）------配置项

包管理工具和配置项npm和package.jsonnpm是NodePackageManager的简称，顾名思义，它是node的包管理工具，也是目前世界上最大的开源库生态系统。使用vue-cli来构建自己的项目，并生成了相应的目录结构，而在最外层目录中，我们可以看到有package.json这一文件，该文件便是我们需要了解的包管理文件，例如：{"name":"my-project","version
静水流深之鑫·2019-07-20 17:15

Vue学习笔记（一）

这里写自定义目录标题一、前端流行框架二、渐进式框架三、Vue框架1.v-for2.v-if/v-else/v-show3.事件处理v-on4.系统修饰键5.双向数据绑定：v-model6.值绑定7.样式绑定8.类绑定四、Vue框架网页五、与jQuery相比1.DOM操作少了2.支持双向数据绑定3.支持组件化五、缺点六、最优用处一、前端流行框架Bootstrap：CSS框架，移动设备优先的前端开发框
王木木木木·2019-07-19 18:22

Vue学习笔记-day4

nrm的安装使用作用：提供了一些最常用的NPM包镜像地址，能够让我们快速的切换安装包时候的服务器地址；什么是镜像：原来包刚一开始是只存在于国外的NPM服务器，但是由于网络原因，经常访问不到，这时候，我们可以在国内，创建一个和官网完全一样的NPM服务器，只不过，数据都是从人家那里拿过来的，除此之外，使用方式完全一样；运行npminrm-g全局安装nrm包；使用nrmls查看当前所有可用的镜像源地址以
AriesZzz·2019-07-14 16:26

Vue学习笔记day3

定义Vue组件什么是组件：组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可；组件化和模块化的不同：模块化：是从代码逻辑的角度进行划分的；方便代码分层开发，保证每个功能模块的职能单一；组件化：是从UI界面的角度进行划分的；前端的组件化，方便UI组件的重用；全局组件定义的三种方式使用Vue.extend配合
AriesZzz·2019-07-14 10:12

vue学习笔记（三）

1.计算属性在业务逻辑中遇到复杂的计算的时候使用计算属性结果显示如下2.计算属性与方法的区别可以使用methods来替代computed，效果上两个都是一样的，但是computed是基于它的依赖缓存，只有相关依赖发生改变时才会重新取值。而methods在重新渲染的时候，函数总会重新调用执行。computed效果会更好一下，如果场景中不想存在缓存的话，选择methods.3.侦听属性当你有一些数据需
独宠子沫·2019-07-12 09:46

vue学习笔记（二）

接上篇1.vue模板语法Vue.js使用了基于HTML的模板语法，允许开发者声明式地将DOM绑定至底层Vue实例的数据。所有Vue.js的模板都是合法的HTML，所以能被遵循规范的浏览器和HTML解析器解析。在底层的实现上，Vue将模板编译成虚拟DOM渲染函数。结合响应系统，Vue能够智能地计算出最少需要重新渲染多少组件，并把DOM操作次数减到最少。（1）插值（基本的数据绑定）对应的数据随绑定值的
独宠子沫·2019-07-11 08:15

Vue学习笔记（二十）——Vue为什么不推荐直接操作dom

Vue不推荐开发者直接操作dom（当然这并不表示不能这么做），有以下几个原因：破坏了代码模块化结构导致代码腐化：组件原本可以控制哪些dom操作可以对外暴露（即对应methods中的方法），但直接操作dom跳过了这个控制，这会导致不可预料的后果。例如组件A中有一个输入框，且组件A没有暴露可以删除输入框的方法，此时组件A会认为输入框是必定存在的，可以放心获取输入框的信息，但在其他组件中通过直接操作do
讨厌走开啦·2019-07-10 11:31

五、VUE学习笔记 5 | 进阶 Vue CLI---路由

目录1、安装路由组件的设定-仅两步2、第一个例子3、动态路由4、嵌套路由5、路由拼图6、重定向及别名7、多参数路由1、安装VUECLI可以选择安装，如果没有安装则运行以下命令$npminstallvue-router--save--save-exact路由组件的设定-仅两步1、src/router/index.js---路由的配置文件，做组件映射importVuefrom'vue'importRo
shawn_jing128·2019-07-03 20:39

Vue学习笔记

Vuevue在MVVM中充当ViemModel层，与jQuery不同的是，vue面向数据编程，jQuery面向DOM编程Vue常用知识点(模板语法、条件渲染、列表渲染)vueinitwebpack[项目名]----初始化项目模板语法newVue({el:'.bg',//挂载点template:'{{msg}}',//模板data:{msg:'hellovue'}，methods:{//存储方法,使
BZeHong·2019-07-02 14:39

vue学习笔记(下)

这篇文章是接着我的上部vue学习笔记写的,之所以分开写这两篇文章是因为我意识到不知道什么时候就写了非常多的字了,所以我决定拆分来写,这一篇我一定写得比上一篇还要简洁争取用更少的字更通俗易懂的解释让大家都能学会甚至精通
看物看雾·2019-06-29 10:28

vue学习笔记(上)

Vue一文学会?Vue大家都知道就是一个国内非常流行的框架，最近因为过了许久没用Vue对于Vue的许多早已淡忘，所以目前正在复习Vue顺便记录一下笔记，以后忘了也可以进行查证，因为这是根据自己的性格所写的笔记，可能大家会看不懂，如果看不懂请尽量不要试着看，可以去看看其他的博主写的文章！起步如果需要知道怎么使用webpack手动搭建vue环境的麻烦传送那么我们还是使用Vue的官方cli进行构建Vue
看物看雾·2019-06-27 16:06

AntDesign vue学习笔记（三）嵌套路由使用

本项目目前结构如下1、Login页面=》MainFrm页面=》MainFrm左部菜单，右边是显示区域可以切换子页面。2、当点击左部菜单时，右边的子页面随着进行切换。实现关键代码如下1、修改router下的index.jsexportdefaultnewRouter({routes:[{path:'/',name:'登录',component:Login}{path:'/MainFrm',name:
weixin_30721899·2019-06-24 20:00

Vue学习笔记-基础篇

文章目录Vue的重点：Vue的基本属性的用法事件修饰符事件冒泡：Vue的重点：组件通信，状态管理，复用，事件管理减少不必要的DOM操作，提高渲染效率，双向绑定概念，只需要关心数据的业务逻辑。Vue实例中的都是配置对象Vue获取一个div之后，div中所有数据直接用{{}}(插值符号)就可绑定，Vue实例控制的元素区域new出来的是Vue实例，也就是MVVM中的vm调度者，配置对象就是M，div视图
AriesZzz·2019-06-20 19:47

VUE学习笔记 const _this = this

b856486b090a6da8d2d396a543f84e4.png关于const_this=this当前VUE中的this是指向实例，相当于父级，指向指不到子级中。所需需要一个变量_this存储this得指向。还有一种方式，不用考虑const_this=this。将.then(()=>{})和.catch(()=>{})中的function换成箭头函数，因为箭头函数中的this是指向当前作用域
90后徐先生·2019-06-18 15:30

前端框架vue学习笔记：环境搭建

兼容性不兼容IE8以下VueDevtools能够更好的对界面进行审查和调试环境搭建1.nodejs(新版本的集成了npm)【npm是node包管理nodepackagemanager】下载nodejs（http://nodejs.cn）node-v终端查看安装成功，npm-v查看npm版本安装成功2.安装vuenpminstallvue安装vue脚手架npminstall--globalvue-c
SongShiYan·2019-06-01 17:00

Vue学习笔记3—Vue插件

Vue插件获取DOM元素使用方法：在template中标识元素ref=“xxx”在要获取的时候，this.$refs.xxx获取元素创建组件，装载DOM，用户点击按钮ref在DOM上获取的是原生DOM对象ref在组件上获取的是组件对象$el是拿其DOM这个对象就相当于我们平时玩的this，也可以直接调用函数$refs获取组件内的元素$parent获取当前组件对象的父组件$children获取子组件
Hades____·2019-05-10 22:30

Vue学习笔记2—Vue基础

Vue基础复习options的根属性el:目的地（string||DOM元素）template:模板data:可以直接返回一个对象，也可以是一个函数，然后return一个对象；在对象中的属性，可以直接在页面中用key使用，但是在js中要使用this.keycomponents:用来声明组件的一个对象属性，key是组件名，value是组件对象methods:存放方法的对象属性，通过methodNam
Hades____·2019-05-10 22:51

Vue学习笔记1—初识Vue

初识Vue前端的框架与库的区别总的来说，框架就是提供了前段项目的整体解决方案；库就是自己组合来实现项目。打比方来说，前端的库就像是我们平时家里用的工具箱，里面有起子、锤子等各种工具。我们可以通过这个工具箱来制造东西，甚至我们可以用工具箱自己制造一下工具，方便以后我们制造东西；而框架，就更像是我们在淘宝上买好的的玩具车的框架，回来后拼装完成，然后可以根据自己的需要，贴上不同的贴纸，喷上不同的颜色，但
Hades____·2019-05-10 22:18

Vue学习笔记七（边界问题，过渡和动画）

一、边界问题这里记录的都是和处理边界情况有关的功能，即一些需要对Vue的规则做一些小调整的特殊情况。不过注意这些功能都是有劣势或危险的场景的。我们会在每个案例中注明，所以当你使用每个功能的时候请稍加留意。1.访问元素&组件1）访问根实例在每个newVue实例的子组件中，其根实例可以通过$root属性进行访问。例如，在这个根实例中：//Vue根实例newVue({data:{foo:1},compu
渐渐_·2019-04-18 21:43

VUE学习笔记：环境准备

原文链接：VUE学习笔记：环境准备转载请注明出处：simiam.com1.NodeNode是JavaScript语言的服务器运行环境。
cza55007·2019-04-15 14:32

2019-04-07

Vue学习笔记{{message}}Canuseeme?
Gorgine·2019-04-07 22:50

vue学习笔记五：在vue项目里面使用引入公共方法详解

今天早上来到公司，没事看了一下别人的博客，然后试了一下，发现的确是可以的，在此记录一下，方便自己日后查阅。首先新建一个文件夹：commonFunction,然后在里面建立一个文件common.js建立好之后，在main.js里面引入这个公共方法最后是调用这个公共方法测试一下，我在公共方法里面写了一个简单的一段代码如下：exportdefault{login:function(){console.l
Fiona_lms·2019-04-04 14:59

Vue学习笔记1-windows系统搭建VUE环境

第一步node环境安装1.1如果本机没有安装node运行环境，请下载node安装包进行安装1.2如果本机已经安装node的运行换，请更新至最新的node版本下载地址：https://nodejs.org/en/或者http://nodejs.cn/第二步node环境检测2.1在终端输入:node-v如果输出版本号，说明我们安装node环境成功2.2查看npm的版本号在终端输入:npm-v第三步设置
牧云流·2019-03-26 16:17

Vue学习笔记

目录一.vue基础知识1.vue-cli创建项二vue资源使用总结1.vue使用three.js知识总结2.vue背景图为动图3.vue使用阿里巴巴矢量库4.vue使用Animate.css动效库5.vue使用ElementUI6.vue使用echarts7.vue使用jquery8.vue使用jquerysupersized插件实现幻灯片的效果四.vue使用知识总结1.动态修改class类一.v
HarSenZhao·2019-03-18 11:44

vue学习笔记4

父组件向子组件传值组件实例定义方式，注意：一定要使用props属性来定义父组件传递过来的数据//创建Vue实例，得到ViewModelvarvm=newVue({el:'#app',data:{msg:'这是父组件中的消息'},components:{son:{template:'这是子组件---{{finfo}}',props:['finfo']}}});使用v-bind或简化指令，将数据传递到
地对地导弹·2019-03-17 17:00

vue学习笔记3

Vue.js-Day3定义Vue组件什么是组件：组件的出现，就是为了拆分Vue实例的代码量的，能够让我们以不同的组件，来划分不同的功能模块，将来我们需要什么样的功能，就可以去调用对应的组件即可；组件化和模块化的不同：模块化：是从代码逻辑的角度进行划分的；方便代码分层开发，保证每个功能模块的职能单一；组件化：是从UI界面的角度进行划分的；前端的组件化，方便UI组件的重用；全局组件定义的三种方式使用V
地对地导弹·2019-03-13 21:00

vue学习笔记（四）- cmd无法识别vue命令解决方法

解决控制台无法识别vue命令问题作者：狐狸家的鱼本文链接：cmd无法识别vue命令解决方法GitHub：sueRimn在控制台输入vue会报以下错误：vue:无法将“vue”项识别为cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写，如果包括路径，请确保路径正确，然后再试一次。所在位置行:1字符:1+vue+~~~~+CategoryInfo:ObjectNotFound:(vue:
狐狸家的鱼·2019-02-26 13:00
上一页 16 17 18 19 20 21 22 23 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他