vue入门

Vue组件学习

Vue学习：（一）Vue入门学习（二）Vue指令学习（三）Vue组件学习1、通过Vue的component方法来定义一个全局组件。//定义全局组件，两个参数：1，组件名称。
hwt1070359898·2019-10-06 12:10

Vue指令学习

Vue学习：（一）Vue入门学习（二）Vue指令学习（三）Vue组件学习1、{{}}插值表达式{{name}}解决插值闪烁问题：v-text:v-html:使用v-text和v-html指令来替代`{{
hwt1070359898·2019-10-06 11:17

Vue入门

一.开发工具VUE开发环境个人推荐使用VScode,然后安装特定的插件即可开发，可用插件如下：Vetur——语法高亮、智能感知、Emmet等EsLint——语法纠错AutoCloseTag——自动闭合HTML/XML标签AutoRenameTag——自动完成另一侧标签的同步修改PathIntellisense——自动路劲补全HTMLCSSSupport——让html标签上写class智能提示当前项
任未然·2019-10-03 23:10

vue父子组件传值例子

vue入门提交{{item}}-->Vue.component('todo-item',{props:['content','index'],template:"{{content}}",methods
brady.wang·2019-10-02 14:00

vue简单todolist

vue入门提交{{item}}newVue({el:"#app",data:{inputValue:'',list:[]},methods:{add(){this.list.push(this.inputValue
brady.wang·2019-10-02 13:00

vue中计算属性和侦听属性

vue入门姓名{{fullName}}{{count}}newVue({el:"#app",data:{firstname:'',lastname:'',count:0},computed:{fullName
brady.wang·2019-10-02 12:00

vue入门笔记

一，Vue入门关于Vue官网：https://cn.vuejs.org/文档：https://cn.vuejs.org/v2/guide/文档plus：http://vue_book.siwei.me/
noneplus·2019-09-30 22:00

19.表单输入绑定----复选框 ---(vue入门 文档学习记录)

单个复选框绑定到布尔值:{{checked}}varvm=newVue({el:"#app-6",data:{checked:true}})首先,确定v-model的双向绑定作用:1.v-model绑定了vue模板中的参数2.v-model绑定了label中的值显示多个复选框JackJohnMikeCheckednames:{{checkedNames}}varvm=newVue({el:"#ap
爱飞的笨鸟·2019-09-24 17:59

（1）Vue 学习----脚手架、webpack

Vue入门文章https://cn.vuejs.org/v2/guide/instance.html1、安装脚手架使用下列任一命令安装这个新的包：npminstall-g@vue/cli#ORyarnglobaladd
可爱的鑫鑫·2019-09-18 17:29

vue入门例子

vue入门例子1、声明示渲染{{message}}2、绑定事件v-bind3、控制切换一个程序是否显示v-if4、渲染循环v-for5、点击事件v-on6、双向数据绑定v-model一、声明示渲染{{message
web与webGL·2019-09-10 17:00

vue入门demo：用户管理3

该入门demo是使用组件的方式实现，不涉及向后端发送请求说明把用户列表和添加用户拆分为两个组件，用户列表数据在父组件获取用户列表：用户列表组件获取父组件的用户列表（父组件向子组件传值）1-11-21-3添加用户：把添加到添加用户组件的数据传给父组件，父组件再添加到数组（子组件给父组件传值）2-12-22-3删除用户：把用户列表组件id传给父组件，父组件再根据id查询到索引，删除对应的元素（子组件给
itmacy·2019-08-29 18:00

Vue入门教程--v-model数据的双向绑定详解（article:5）

Vue.js初步入门属性介绍v-model：唯一一个可以实现双向数据绑定的属性使用详解1.v-model原生js中，要是想将标签元素上嵌入自定义数据，必须增加一个data-*的属性来嵌入：按钮functionhandleBtn(res){console.info(res.getAttribute("data-myData"));};而且这种数据嵌入方式是单向的，要想取回来也要调用DOM对象进行设置
DuCeh·2019-08-28 16:15

Vue入门到TodoList练手

学习资料慕课网-vue2.5入门基础语法示例代码1hello{{msg}}newVue({el:"#root",template:'hello{{msg}}',data:{msg:"world"}})挂载点：vue实例绑定的dom节点模板：挂载点输出的内容，可以直接在挂载点内部编写，也可以通过template属性实现。示例代码1中div标签内部的hello{{msg}}和vue中的template
程序小工·2019-08-28 14:00

Vue专题(一)-Vue入门

1.前言先聊一下前端开发模式的发展。静态页面最初的网页以HTML为主，是纯静态的网页。网页是只读的，信息流只能从服务端到客户端单向流通。开发人员也只关心页面的样式和内容即可。异步刷新，操作DOM1995年，网景工程师BrendanEich花了10天时间设计了JavaScript语言.随着JavaScript的诞生，我们可以操作页面的DOM元素及样式，页面有了一些动态的效果，但是依然是以静态为主。a
IT熊猫学院·2019-08-25 13:49

vue入门demo：用户管理2

该demo由前端请求后台服务器获取数据进行渲染使用到的技术点1.使用到的vue指令：{{}}v-ifv-forv-model2.使用到的事件：@click点击事件，@keyup.enter回车3.使用到的事件修饰符：.prevent阻止事件默认行为4.使用vue-resource发起请求获取服务端返回的数据5.使用生命周期函数created()，即在页面渲染前请求用户列表6.自定义私有过滤器7.j
itmacy·2019-08-24 13:00

vue入门demo：用户管理1

该demo纯前端实现使用到vue技术点：1.在该demo中使用到的vue指令：{{}}、v-if、v-model、@clickv-for2.在该demo中使用到的事件修饰符：.prevent（阻止事件默认行为）3.在该demo中使用到的api:arr.push(item,...)：向数组末尾添加一个或多个元素arr.splice(index,num)：删除并插入，删除指定索引和数量的元素，并添加新
itmacy·2019-08-23 18:00

使用Vue开发微信小程序：mpvue框架

原文链接：https://www.jianshu.com/p/8f779950bfd9【原文地址】mpvue入门系列教程：如何在mpvue中正确的引用小程序的原生自定义组件使用mpvue开发小程序教程（
pengjunlee·2019-08-22 17:11

vue入门示例（一）

为了让广大后端人员更快的理解上手vue，我们先不适用ide和vue-cli等工具，先采用手动引入js的方式，从一个最简单的例子开始，循序渐进1.到官网下下vue.jsvue官网我们这里使用开发版，它包含了许多警告提示信息新建一个文件夹把vue.js放进去，然后创建一个html文件命名为index.html2.第一个helloworld编辑index的内容hello{{msg}}newVue({el
herokang·2019-08-21 15:58

Vue入门---配置环境，搭建项目

当下三大主流框架：Vue，Angular，React。因Vue的一些优势，Vue成为许多前端开发者的首选框架。依据17年-18年的框架使用趋势，可以看出来Vue迅速被越来越多前端开发者使用。17、18年的框架使用搭建Vue环境：一、搭建node.js环境下载网址：https://nodejs.org/en/nodejs官网下载一般下载稳定版本即可。其他环境下载版本下载完成安装，直接一路next，是
小小米柚儿·2019-08-16 11:04

后端小白的VUE入门笔记, 进阶篇

使用vue-cli(脚手架)搭建项目基于vue-cli创建一个模板项目通过npmroot-g可以查看vue全局安装目录,进而知道自己有没有安装vue-cli如果没有安装的话,使用如下命令全局安装cnpminstall-gvue-cli创建一个基于webpack的新项目,在这过程中,会安装依赖vueinitwebpack项目名启动cdvue-router-demonpmstart常用的目录结构如果我
赐我白日梦·2019-08-09 10:00

Web——Vue入门语法

vue入门{{msg}}//声明一个vue对象newVue({el:"#root1",data:{msg:"thisismycoat!"}})
何惜戈·2019-08-07 22:01

后端小白的VUE入门笔记, 前端高能慎入

因为项目需要前后端分离,后端竟然不用控制view层了,页面的跳转后端不再干涉,(前端的vue经过打包后成了一张index.html)后端只需要响应给前端json串就ok,其实这不是爽歪歪?但是觉得还是奇奇怪怪,感觉前端是个黑盒了,于是忍不住去学习了vue感觉前端的框架带来的这种前后端分离变化还是特别明显的,后端确实不用再操心view层了,页面的转换有vue通过后端的切换不同的组件,后端基本上没有什
赐我白日梦·2019-08-05 15:00

从Vue入门到React入门

脚手架vue-cli=>create-react-app(create-react-appxxx--typescript)proxy接口代理老版本vue-cli的代理在config下的config/proxyConfig中配置，然后再在config/index.js下的proxyTable中引入module.exports={proxy:{'/xxxx':{target:'http://xxx.c
zpkzpk·2019-07-29 14:18

vue入门安装

安装node.js首先需要安装好node.js,在官网下载，安装好后，可以在命令行输入node-v来检测是否安装好。新版的一般自带npm，使用npm-v来检测是否安装了npm中国境内最好安装淘宝的镜像npminstallcnpm-g安装vue-clivue-cli是官方提供的一个脚手架，着实好用。PS：没有安装cnpm就把cnpm换成npmcnpminstall--globalvue-cli初始化
NignSah·2019-07-07 10:02

Vue入门

npminstall-gcnpm--registry=https://registry.npm.taobao.orgcnpminstall--globalvue-clivueinitwebpackmy-projectcdmy-projectcnpminstallnpmrundevdata中return的都是用到的定义的数据过滤器filters:{}输出字符倒序msg.split('').rever
月夜星星雨·2019-07-02 17:12

vue入门以及一些常用指令

入门练习{{msg}}//创建vue实例--mvvm中的vmviewmodelvarvm=newVue({el:'#app',//挂载元素，当前vue实例控制区域data:{//当前vue实例的数据，--mvvm中的mmsg:'helloVue!!!'}})常用指令v-cloak处理数据渲染时，因网速过慢，导致用户看家类似{{msg}}的数据{{msg}}varvm=newVue({el:"#ap
北街九条狗·2019-06-28 10:45

vue入门实战小案例

实现页面表单添加列表功能。使用vue之前先要引入vue.js上代码：01-Vue的常用指令-综合练习#app{margin:50pxauto;width:600px;}fieldset{border:1pxsolidorangered;margin-bottom:20px;}fieldsetinput{width:200px;height:30px;margin:10px0;}table{widt
壹之形·2019-06-24 23:22

VUE全局变量与局部变量---(vue入门 文档学习记录)

转自:https://www.cnblogs.com/webxu20180730/p/10890888.html作用域:全局作用域：Vue对象全局api局部作用域：实例对象vm实例api组件component组件配置选项在引入Vue文件时，就相当于拥有了一个全局Vue对象。在varvm=newVue(option)时，就相当于创建了一个实例对象vm在注册一个组件后，就相当于创建了一个组件对象。全局
爱飞的笨鸟·2019-06-24 11:32

vue入门案例

12345vue入门6789101112{{message}}131415//创建一个Vue的实例，让这个实例去接管id为app的这个元素16varvue=newVue({17el:"#app",//el
小段大帅·2019-06-23 10:00

vue入门案例

12345vue入门6789101112{{message}}131415//创建一个Vue的实例，让这个实例去接管id为app的这个元素16varvue=newVue({17el:"#app",//el
别先生·2019-06-23 10:00

Vue入门十三、路由的传参和取参

1、查询参login?id=12345配置：（传参）:to="{name:'login',query:{id:'loginid'}}"获取：（取参）this.$route.query.id2、路由参数配置：（传参）:to="{name:'login',params:{id:'loginid'}}"获取：（取参）this.$route.params.id3、路径参数register/register
茕茕木偶·2019-06-11 11:26

Vue入门十二、路由的跳转

路由之间的跳转有再种：1、通过标签去登录实现跳转2、通过js实现：this.$router.push({path:'/buy'})this.$router.replace({path:'/buy'})2.1push与replace的区别push会向history插入新记录replace不会插入history历史记录，如果返回上一页，则会跳转到上上一页中。上一页是不存在的返回上一页面：this.$r
茕茕木偶·2019-06-07 12:16

vue入门4---表单输入的绑定、Vue实例生命周期

一、表单输入绑定使用v-model(双向数据绑定)自动收集数据text/textareacheckboxradioselect用户名:密码:性别radio:女男爱好checkbox:篮球足球乒乓城市select:未选择{{city.name}}介绍textarea:newVue({el:'#demo',data:{username:'',pwd:'',sex:'男',//默认显示男likes:['
奋斗滴猩猩·2019-06-05 11:39

vue入门1----Vue基本使用

一、Vue插件介绍1.定义：vue是渐进式开发框架，即如果有现成的服务端应用，可以将vue作为该应用的一部分嵌入其中，可先用核心的库，若有特殊需求，再加入特定的插件，这样会有更加丰富的交互体验。2.vue的特点：MVVM模式；编码简洁，体积小，效率高；只关注视图层（UI），轻松引入vue插件和其他第三方开发项目；作用：可动态构建用户界面，（构建指将后台数据动态展示在前端界面）声明式编程3.vue与
奋斗滴猩猩·2019-06-05 10:30

二、Vue实例中的数据、事件和方法（v-text、v-html、v-on）

二、Vue实例中的数据、事件和方法（v-text、v-html、v-on）Vue入门{{msg}}newVue({el:"#root",data:{msg:"helloworld"}})上述例子中，data
李浩然_6fd1·2019-06-05 00:41

简单的vue入门案例

一、简单入门HelloWorld案例二、插值表达式三、点击事件四、按键事件1.如果按下不是0-9则阻止事件执行2.打印按下什么按键五、鼠标事件1.打印绝对坐标2.打印相对坐标3.鼠标mousemove4.阻止冒泡(阻止事件的传播)六、事件修饰符1.阻止跳转页面v-on:submit.prevent@click==v-on:click2.阻止向上传递@click.stop七、按键修饰符1.指定键盘按
L-李俊漩·2019-06-04 17:24

Vue入门十一、路由的使用

一、vue-router使用1、下载npmivue-router-S2、安装插件Vue.use(VueRouter)3、创建路由对象varrouter=newVueRouter()4、配置路由规则router.addRoutes([路由对象])路由对象{path:'锚点',component:需要显示的组件}5、将配置好的路由对象交给Vue6、使用组件二、代码示例方法一、TitlevarLogin
茕茕木偶·2019-06-03 23:31

Vue入门十、路由跳转（哈希模式）

单页一应用的路由模式有再种1、哈希模式（利用hashchange事件监听url的hash的改变）window.addEventListener("hashchange",function(e){console.log(e)})2、history模式Title登录注册varappdiv=document.getElementById("app")window.addEventListener("ha
茕茕木偶·2019-05-29 10:40

Vue入门九、Vue生命周期

先上图：示例代码：Titlevarmytest={template:`测试{{msg}}点一下数据会更新`,data(){return{msg:'嗯呢'}},//组件创建前beforeCreate(){console.log('组件创建前')console.log(this.msg)},//组件创建后created(){console.log('组件创建后')console.log(this.ms
茕茕木偶·2019-05-29 10:53

Vue入门八、非父子组件间通讯

通过Bus总线机制实施非父子组件通讯1、创建一个空实例（Bus中央事件总线也可以叫中间组件）2、利用$emit$on触发和监听事件实现非父子组件的通信组件之间使用this.$bus.$on传值之前需要先this.$bus.$off注销事件即：this.$bus.$off('hiHeader').$on('hiHeader',(val)=>{this.sending=val})详见：组件之间使用th
茕茕木偶·2019-05-28 20:02

Vue入门七、父子组件间通讯

一、父子组件通讯父传子：1、父用子的时候通过属性传递2、子要声明props:['属性名']接收3、子组件template中直接用Title//父传子varchild={template:`我是子组件{{sendToChild}}`,props:['sendToChild']}varparent={template:`我是父组件`,components:{child}}newVue({el:'#ap
茕茕木偶·2019-05-23 21:10

Vue入门六、slot插槽,$refs,$parent

1、slot插槽slot就是子组件里给DOM留下的坑位，动态的DOMTitlevarparent={template:`我是父组件`}newVue({el:'#app',template:`我是插槽haah我也是插槽但是不会显示因为我没有指定slot名称`,components:{parent}})2、ref获取子组件实例a、识别：在子组件或元素上使用属性ref="xxx"b、获取：this.$r
茕茕木偶·2019-05-21 22:35

Vue入门五、组件化开发

创建组件的两种方式：1、局部组件声明、注册和使用：方法一(推荐)、Title//局部组件声明varmyHeader={template:`我的头可不是面团捏的`}newVue({el:'#app',//组件注册components:{myHeader},//组件使用template:``})方法二、Title//局部组件声明//varmyHeader={//template:`//我的头可不是面团
茕茕木偶·2019-05-21 22:41

vue入门教程 简单实现一个hello world

vue入门教程简单实现一个helloworld此篇适合没学习过vue的小白观看，有一定基础可观看笔者vue笔记相关文章，本文主要介绍，和讲解vue。
MmM豆·2019-05-21 11:26

Vue入门四、单个监听watch、深度监听deep、多个监听computed

watch单个监听computed多个监听当watch监听复杂数据类型的时候需要做深度监听deepwatch深度监听deep表达式：//深度监听watch:{msg:{handler(val,oldval){if(val.text=='love'){alert('ILoveYou')}},deep:true//开启深度监听}}watch深度监听Titlewatch监听器newVue({el:'#a
茕茕木偶·2019-05-21 09:10

Vue入门三、过滤器filter

Vue中过滤器有两种：1、全局过滤器Vue.filter('过滤器名',过滤方式fn);2、组件内过滤器filters:{'过滤器名',过滤方式fn}使用:{{msg|过滤器方法名}}一、局部过滤器Title我输入的：正常输出的：{{instring}}反转输出：{{instring|rever}}{{instring|revers('反转输出：')}}newVue({el:'#app',data
茕茕木偶·2019-05-21 00:04

Vue入门二、单双向数据流和事件绑定

1、Vue单向数据流绑定属性值v-bind:(属性)，简写:(属性)eg:a、内存改变影响页面改变b、v-bind就是对属性的简单赋值，当内存值改变，还是会触发重新渲染2、Vue双向数据流绑定v-model="值"eg:a、双向数据绑定，页面对于input的value改变，能影响内存中name变量3、事件绑定v-on:事件名="表达式||函数名"，简写:"表达式||函数名"事件名可以是原生也可以是
茕茕木偶·2019-05-20 21:26

Vue入门一、常用的指令

Vue常用的指令：v-text不可解析HTML标签v-html可解析HTML标签v-if做元素的插入(append)和移除(remove)操作v-else-ifv-elsev-showdisplay:none和display:block的切换v-for数组item，index对象value,key,indexTitlenewVue({el:'#app',template:`测试vif测试velse
茕茕木偶·2019-05-20 21:00

vue快速入门(3)

1.3.vue入门案例1.3.1.HTML模板在hello-vue目录新建一个HTML在hello.html中，我们编写一段简单的代码：xx非常帅h2中要输出一句话：xx非常帅。
开心的小农民·2019-05-19 09:57

Vue入门级语法大成

Vue入门级语法使用方式新手学习，只需要以引入的方式即可。
帅大叔的简书·2019-04-25 15:12
上一页 11 12 13 14 15 16 17 18 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他