1. 父组件给子组件传值    1)<组件  属性="传改子组件的值"></组件>       v-bind:属性="识别数据类型和变量"  不用v-bind 传递的都是字符串           2) 子组件通过props选项  props:["属性"]        props:{            属性:类型        }                        props:{           属性…

[vue知识点]2)vue登录认证…

Vue 组件通讯 ——常见使用场景可以分为三类: 父子通信: 父向子传递数据是通过 props,子向父是通过 events($emit):通过父链 / 子链也可以通信($parent / $children):ref 也可以访问组件实例:provide / inject API:$attrs/$listeners 兄弟通信: Bus:Vuex 跨级通信: Bus:Vuex:provide / inject API.$attrs/$listeners 1.require.context() 1.场…

一.学习vue必须了解的几个知识点  1.node.js介绍 node是一个让JavaScript运行在服务端的开发平台,使用JavaScript也可以开发后台服务.说明白些它仅仅是一个平台,我们使用vue开发必须要安装node.js.  2.npm 介绍 npm是node.js官方提供的包管理工具,他已经成了Node.js包的标准发布平台,用于Node.js包的发布.传播.依赖控制.npm提供了命令行工具,使你可以方便地下载.安装.升级.删除包,也可以让你作为开发者发布并维护包.我们可以直接使…

知识点归纳整理如下: 组件 component     1.页面中的一部分,可以复用, 本质上是一个拥有预定义选项的一个 Vue 实例         2.使用         1)定义             全局组件               a.定义                Vue.component("组件的名字",{                    template:"<div>组件模版的内容</div>"      …

知识点归纳整理如下: 1. 数组用下标改变,或者对象增加属性,这样的改变数据   是不能触发视图更新的,要用 Vue.set(对象,属性,值) 或this.$set(对象,属性,值) 2. this.$forceUpdate();  //不推荐使用  3. v-once 4. 计算属性 computed      计算属性可以对数据(data)进行各种加工和计算,返回加工和计算后的值,      用计算属性,模板里就可以直接拿到对数据计算和加工的结果.      而且这个结果是随着数据变化,自动…

1. Vue.js 是什么       Vue是一套用于构建用户界面的渐进式框架 2. vue的环境搭建(Vue2 ) 3. 经典的hello world         new Vue({           el:"挂载的元素"  挂载的元素不能是body或html           data:{ key:value...}  data是存储数据的地方    (要把这数据渲染/挂载到模板里面)           template:"<div>模板的内容&l…

1. Vue生命周期图示: 2.插值: 文本:{{ message }}: 纯html:v-html="xxx"; 属性:v-bind:id="xxx"; 使用 JavaScript 表达式:{{ ok ? 'YES' : 'NO' }} 过滤器:{{ message | capitalize }} 3.指令: 参数:v-bind:href="xxx"; v-on:click="xxx"; 修饰符:v-on:submit.pr…

一.对于MVVM的理解? MVVM 是 Model-View-ViewModel 的缩写.Model代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑.View 代表UI 组件,它负责将数据模型转化成UI 展现出来.ViewModel 监听模型数据的改变和控制视图行为.处理用户交互,简单理解就是一个同步View 和 Model的对象,连接Model和View.在MVVM架构下,View 和 Model 之间并没有直接的联系,而是通过ViewModel进行交互,Model 和 View…

v-bind和v-model的区别 1.v-bind用来绑定数据和属性以及表达式,缩写为':' 2.v-model使用在表单中,实现双向数据绑定的,在表单元素外使用不起作用 什么是 mvvm? MVVM 是 Model-View-ViewModel 的缩写.mvvm 是一种设计思想.Model 层代表数据模型,也可以在 Model 中定义数据修改和操作的业务逻辑:View 代表 UI 组件,它负责将数据模型转化成 UI 展现出来,ViewModel 是一个同步 View 和 Model 的对象.…

1.如何去除vue项目中的 # --- History模式: https://www.cnblogs.com/zhuzhenwei918/p/6892066.html 2.三分钟教你写个Vue组件: https://www.jianshu.com/p/e731d9ad4ed1…

基础知识: vue的生命周期: beforeCreate/created.beforeMount/mounted.beforeUpdate/updated.beforeDestory/destoryed vue常用指令: v-for.v-bind(缩写形式:prop).v-on(缩写形式@click=’sss').v-if/v-else/v-else-if.v-model.v-once.v-html.v-show... vue自定义组件:Vue.component(‘componentName'…

Vue 中的 slot: 概念:槽/slot是组件在模板中为调用者预留的位置,使用<slot>元素声明一个 槽.在最终的视图中,调用者模板中被调用组件的内容,将填充<slot>元素 占据的位置,形成最终的模板. 一篇比较好的介绍文章: 深入理解vue中的slot与slot-scope:https://segmentfault.com/a/1190000012996217 Vue 中的 slot: 在Vue中,slot是一个很有用的特性,可以用来向组件内部插入一些内容.slot就是&…

0x00 修饰符 .lazy 在默认情况下,v-model 在每次 input 事件触发后将输入框的值与数据进行同步 .你可以添加 lazy 修饰符,从而转变为使用 change 事件进行同步: <!-- 在“change”时而非“input”时更新 --> <input v-model.lazy="msg" > .number 如果想自动将用户的输入值转为数值类型,可以给 v-model 添加 number 修饰符 <input v-model.numb…

vuex是解决多层父子关系传值的问题,减少了传值的复杂度 vue+webpack安装图示…

文件夹和文件名称 简介 build 构建脚本目录 config 应用程序的配置文件 index.html 入口页面 node_modules 存放 NPM 依赖模块 package-lock.json 记录 NPM 包的具体来源和版本号 package.json 应用所需的 NPM 包配置文件 README.md 项目介绍说明文件 src 源码目录 src/App.vue 根组件 src/assets 应用资源目录 src/components 公共组件目录...…

处理用户输入 v-on指令添加一个事件监听器 div id="app-5"> <p>{{ message }}</p> <button v-on:click="reverseMessage">逆转消息</button> </div> var app5 = new Vue({ el: '#app-5', data: { message: 'Hello Vue.js!' }, methods: { rev…

ES6常用语法 变量的定义 let定义变量 不会变量提升 有全局作用域和函数作用域,块级作用域{} 不能重复定义 var定义变量 会变量提升 只有全局作用域和函数作用域 能够重复定义 const定义变量 定义的是一个 常量,定义之后不能进行修改 没有变量提升 不能重复定义 带来了块级作用域 定义常量的时候必须赋值 模板字符串 let username1 = "username" oDiv.innerHTML = ` <h1>${username1}</h1> &…

1.对于mvvm的理解 mvvm是model-view-viewModel vue是以数据为驱动的,vue自身将dom和数据进行绑定,一旦创建绑定,dom和数据将保持同步,每当数据发生变化,dom也会跟着变化. viewModel是vue的核心,是vue的一个实例.vue实例时作用于某个html元素上的html元素可以是body,也可以是某个id所指代的元素. 2.嵌套路由怎么定义 在vueRouter的参数中使用children配置 //引入两个组件 import home from "./h…

Vue 脚手架 脚手架 3 的版本 ---- webpack 4 cnpm install -g @vue/cli-----全局安装组件 vue create myapp-----命令行创建项目 或者使用  vue ui--------界面UI创建项目 脚手架 2 的版本 ---- webpack 3 npm install -g @vue/cli-init vue init webpack myapp2 数据的双向绑定 原理 1.实现一个监听器Observer,用来劫持并监听所有属性,如果有变…

vue.js中==和===的区别 1.== 用于比较.判断两者相等,比较时可自动换数据类型 2.=== 用于(严格)比较.判断两者(严格)相等,不会进行自动转换,要求进行比较的操作数必须类型一致,不一致时返回flase.…

.if里面不能用import方式导入,只能用require方式引入 判断长度大于0 getIssues (vue, data) { let label = '' ) { label = `+label:"${data.label}"` } es6中使用Number.isInteger()用来判断一个值是否为整数. 在html将显示时间格式化: <span class="time">{{$moment(comment.created_at).format(…

vue中 列表组件写key,起作用是什么? <ul> <li v-for="item in items" :key="item.id">...</li> </ul> key作为一个特殊属性其作用用于虚拟DOM,对比新旧vnodes,重新排列数组,移除key不存在的元素,如果不使用key,Vue 会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法.…

背景 在vue页面传递数据的过程中,传递数据的引用地址并不会改变,所以当我们改变一些数据时,数据源 也会随之改变.可是有很多情景,我们改变传递的数据,并不需要源数据值发生变化,这时我们就需要对数据进行加工,使数据引用地址发生变化即可. 方法 使用JSON方法将数据解析成字符串,之后再转换成JSON对象数据 JSON.parse(JSON.stringify(........)) Next…

axios中jq的基础 jq语法 $(this).hide() 隐藏当前的html元素 $(''#test").hide() 隐藏id='test'的元素 添加新的 HTML 内容 我们将学习用于添加新内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元素之前插入内容 删除元素/内容 如需删除元素和内容,一般可使用以下两个 jQuery 方法:…

1.iphone5微信浏览器里的methods里貌似不兼容  test(){} 写法,只支持test:function(){} 2.v-cloak 防止双括号的闪烁 <div id="app" v-cloak>{{test}} </div> 在style里 []v-cloak]{display:none;//display:none!important:} 3.computed和watch都有缓存机制  ,{{}}==>差值表达式 4.计算属性的set和g…

1. 数组用下标改变,或者对象增加属性,这样的改变数据   是不能触发视图更新的,要用 Vue.set(对象,属性,值) 或this.$set(对象,属性,值) 2. this.$forceUpdate();  //不推荐使用  3. v-once 4. 计算属性 computed       计算属性可以对数据(data)进行各种加工和计算,返回加工和计算后的值,       用计算属性,模板里就可以直接拿到对数据计算和加工的结果.       而且这个结果是随着数据变化,自动发生改变的   …

一.什么是vue? Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合.链接:https://cn.vuejs.org/v2/guide/ vue.js特点: 解耦视图和数据 可复用的组件 前端路由技术 状态管理 虚拟DOM 二.vue的安装和使用方法 1.安装:可以通过命令行工具安装(~~详细可自行百度~~) 2.直接下载引…

一. 组件component 1. 什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码组件是自定义元素(对象) 2. 定义组件的方式 方式1:先创建组件构造器,然后由组件构造器创建组件方式2:直接创建组件 3. 组件的分类 分类:全局组件.局部组件 4. 引用模板 将组件内容放到模板<template>中并引用 5. 动态组件 <component :is="">组件多个组件使用同一个挂载点…

为什么使用slot slot(插槽) 在生活中很多地方都有插槽,电脑usb的插槽,插板当中的电源插槽 插槽的目的是为了让我们原来的设备具备更多的扩展性 比如电脑的USB我们可以插入U盘,手机,鼠标,键盘等等 组件中的插槽 组件的插槽也是为了让我们的组件更具有扩展性 让使用者决定组件内部的一些内容到底展示什么 例子 移动开发中,几乎每个页面都有导航栏 导航栏我们必然封装成一个插件 一旦有了这个组件,我们就可以在多个页面中复用了 如何封装这类组件(slot) 最好的封装方式就是将共性抽取到组件中,将…