Vue
丘山一郎
这个作者很懒,什么都没留下…
展开
-
Vue组件注册方式(驼峰与横线)
首先看一下官方的文档说明总结起来也就是:(1)当使用短横线分割命名定义组件,那么调用这个组件的时候,必须要用短横线。(2)当使用驼峰式命名的时候,可以在template:’'中使用驼峰式或者短横线都可以,但是在Dom中必须使用短横线的形式。...原创 2020-12-08 16:36:11 · 1255 阅读 · 0 评论 -
vue中watch的三种用法(超级详细版本)
在vue中,使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法:<input type="text" v-model="cityName"/>new Vue({ el: '#root', data: { cityName: 'shanghai' }, watch: { cityName(newName, oldName) { // ... } } })直接写一个监听处理函数,当每次监原创 2020-11-30 13:19:02 · 10315 阅读 · 2 评论 -
Vue 生命周期
生命周期钩子 = 生命周期函数 = 生命周期事件主要的生命周期函数分类:创建期间的生命周期函数:beforeCreate:实例刚在内存中被创建出来,此时,还没有初始化好 data 和 methods 属性created:实例已经在内存中创建OK,此时 data 和 methods 已经创建OK,此时还没有开始 编译模板beforeMount:此时已经完成了模板的编译,但是还没有挂载到页面中mounted:此时,已经将编译好的模板,挂载到了页面指定的容器中显示运行期间的生命周期函数:.原创 2020-10-27 16:57:51 · 88 阅读 · 0 评论 -
vue-router传递参数的几种方式
vue-router传递参数分为两大类编程式的导航 router.push声明式的导航 编程式的导航 router.push编程式导航传递参数有两种类型:字符串、对象。字符串字符串的方式是直接将路由地址以字符串的方式来跳转,这种方式很简单但是不能传递参数:this.$router.push("home");对象想要传递参数主要就是以对象的方式来写,分为两种方式:命名路由、查询参数,下面分别说明两种方式的用法和注意事项。命名路由命名路由的前提就是在注册路由的地方需要给路由命名如:原创 2020-10-26 15:22:18 · 618 阅读 · 0 评论 -
vue 中的query传参与params传参
Vue router 如何传参params、query 是什么?params:/router1/:id,这里的 id 叫做 params。例如/router1/123, /router1/789query:/router1?id=123,这里的 id 叫做 query。例如/router1?id=456query 方式传参和接收参数传参: this.router.push(path:′/xxx′query:id:id)this.router.push({ path:'/xxx' query:{原创 2020-10-26 15:13:03 · 1906 阅读 · 0 评论 -
Vue前后端交互模式(超级无敌详细版本)
Vue前后端交互模式(超级无敌详细版本)具体内容参考:https://www.cnblogs.com/zcy9838/p/13156522.html原创 2020-10-26 14:42:59 · 398 阅读 · 0 评论 -
vue中异步函数async和await的用法
先说一下async的用法,它作为一个关键字放到函数前面,用于表示函数是一个异步函数,因为async就是异步的意思, 异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 写一个async 函数async function timeout() { return 'hello world';}语法很简单,就是在函数前面加上async 关键字,来表示它是异步的,那怎么调用呢?async 函数也是函数,平时我们怎么使用函数就怎么使用它,直接加括号调用就可以了,为了表示它没有阻塞它后面代码的执行,我们在原创 2020-10-26 14:36:51 · 2858 阅读 · 0 评论 -
ajax、axios、fetch之间的详细区别以及优缺点
将jQuery的ajax、axios和fetch做个简单的比较,所谓仁者见仁智者见智,最终使用哪个还是自行斟酌1.jQuery ajax$.ajax({ type: 'POST', url: url, data: data, dataType: dataType, success: function () {}, error: function () {}});优缺点:本身是针对MVC的编程,不符合现在前端MVVM的浪潮基于原生的XHR开发,XHR本身的架原创 2020-10-26 14:01:43 · 143 阅读 · 0 评论 -
vue中的插槽总结-默认插槽,具名插槽,作用域插槽
什么是插槽?插槽(Slot)是Vue提出来的一个概念,正如名字一样,插槽用于决定将所携带的内容,插入到指定的某个位置,从而使模板分块,具有模块化的特质和更大的重用性。插槽显不显示、怎样显示是由父组件来控制的,而插槽在哪里显示就由子组件来进行控制1,默认插槽示例父组件<template> <div> 我是父组件 <slotOne1> <p style="color:red">我是父组件插槽内容</p>原创 2020-10-26 11:06:34 · 1602 阅读 · 0 评论 -
JS中的块级作用域,var、let、const三者的区别
首先,ECMAScript和JavaScript关系:ECMAScript是一个国际通过的标准化脚本语言。JavaScript由ECMAScript和DOM、BOM三者组成。可以简单理解为:ECMAScript是JavaScript的语言规范,JavaScript是ECMAScript的实现和扩展。1. 块作用域{ }JS中作用域有:全局作用域、函数作用域。没有块作用域的概念。ECMAScript 6(简称ES6)中新增了块级作用域。块作用域由 { } 包括,if语句和for语句里面的{ }也属于块原创 2020-10-09 20:47:57 · 244 阅读 · 0 评论 -
vue中 关于$emit的用法
1、父组件可以使用 props 把数据传给子组件。2、子组件可以使用 $emit 触发父组件的自定义事件。vm.$emit( event, arg ) //触发当前实例上的事件vm.$on( event, fn );//监听event事件后运行 fn;例如:子组件:<template> <div class="train-city"> <h3>父组件传给子组件的toCity:{{sendData}}</h3> <br/&g原创 2020-10-08 20:27:06 · 17529 阅读 · 1 评论 -
vue中v-if与v-show的区别
相同点:v-if与v-show都可以动态控制dom元素显示隐藏不同点:v-if显示隐藏是将dom元素整个添加或删除,而v-show隐藏则是为该元素添加css–display:none,dom元素还在。都修改为false后,第一个div是直接被移除掉了需要注意的是,当一个元素默认在css中加了display:none属性,这时通过v-show修改为true是无法让元素显示的。原因是显示隐藏切换,只是会修改element style为display:""或者display:none,并不会覆盖掉或修改原创 2020-09-30 15:18:13 · 881 阅读 · 0 评论 -
vue的事件冒泡 最详细解释版本
先说冒泡,我们都知道水中有气泡的时候,气泡会从水底往上升,由深往浅的。但是水在上升的过程中会经历不同的深度的水。那么我们再来解释一下什么是事件冒泡,如果属性浏览器原理的同学就知道,页面是由文档流(即dom树组成的),当我们在一个时间触发的时候,这个事件就像这个气泡一样,从dom树的底层,一层一层的往上面传递,一直传递到dom的根节点,如果子元素和父级元素触发的是相同事件的时候,当子元素被触发的时候父元素也会被触发冒泡机制,这就是冒泡的基本原理。在不同的内核浏览器中,冒泡是不一样的IE<11:原创 2020-09-30 14:12:39 · 3415 阅读 · 0 评论