Vue中Jsx的使用

什么是JSX? JSX就是Javascript和XML结合的一种格式。React发明了JSX,利用HTML语法来创建虚拟DOM。当遇到<,JSX就当HTML解析,遇到{就当JavaScript解析。 应用场景是什么? 当需要用render函数写一个复杂的组件时,可以考虑使用jsx的方式。让代码结构简 ... »

6. vue组件详解(一)

主要内容: 1. 组件的基本使用 2. 全局组件和局部组件 3. 父组件和子组件 4. 组件语法糖的写法 5. 组件data关联的写法 6. 父子组件的通信 组件系统是 Vue 的一个重要概念,因为它是一种抽象,允许我们使用小型、独立和通常可复用的组件构建大型应用。几乎任意类型的应用界面都可以抽象为 ... »

5. vue常用高阶函数及综合案例

一. 常用的数组的高阶函数 假设, 现在有一个数组, 我们要对数组做如下一些列操作 1. 找出小于100的数字: 2. 将小于100的数字, 全部乘以2: 3. 在2的基础上, 对所有数求和: 通常我们会怎么做呢? <!DOCTYPE html> <html lang="en"> <head> <m ... »

4. Vue基本指令

目录 1. v-on指令 2. v-if指令 3. v-show指令 4. v-for指令 5. v-model指令 一. v-on指令 1. 基础用法 v-on是事件监听的指令, 下面来看简单用法 <!DOCTYPE html> <html lang="en"> <head> <meta char ... »

Vue为何采用异步渲染

Vue为何采用异步渲染 Vue在更新DOM时是异步执行的,只要侦听到数据变化,Vue将开启一个队列,并缓冲在同一事件循环中发生的所有数据变更,如果同一个watcher被多次触发,只会被推入到队列中一次,这种在缓冲时去除重复数据对于避免不必要的计算和DOM操作是非常重要的,然后,在下一个的事件循环ti ... »

3. Vue语法--计算属性

一. 计算属性 1. 什么是计算属性? 通常, 我们是在模板中, 通过插值语法显示data的内容, 但有时候我们可能需要在{{}}里添加一些计算, 然后在展示出来数据. 这时我们可以使用到计算属性 先来举个例子, 比如: 一个班, 有几个学生参加期末考试, 要计算考试的平均分. 我们来看看, 通常要 ... »

2. Vue语法--插值操作&动态绑定属性 详解

目录 1. 设置vue模板 2. vue语法--插值操作 3. 动态绑定属性--v-bind 一. 设置vue模板 我们经常新建一个vue项目的时候, 会写如下的一段代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> < ... »

1. VUE介绍

今天开始系统学习vue前端框架. 我是有前端基础的, 刚工作那会, 哪里分那么清楚啊, 前后端我都得做, 所以, css, js, jquery, bootstrap都会点, 还系统学过ext, 哈哈,是不是都不知道是啥, 没事, 都过时了. 现在开始, 学习最流行的Vue, 后端不会页面, 说不过 ... »

vue常用方法封装-一键安装使用(赠送免费工具)

相信大家在使用vue开发过程中一定遇到了各种方法的整理收集,每次遇到新的问题都需要找到合适的方法 这里我给大家封装了一些vue项目中常用到的方法合集,免费提供费大家 因此,jsoften横空出世,不为别的,只为给你最方便的服务,也勉励自己继续加油 api网址:https://www.mzili.co ... »

微信小程序开发抖音去水印功能

之前找了很多抖音去水印的工具全是广告,所以索性自己写了一个,提供给大家免费试用以下是微信小程序的二维码 使用教程: 1、打开微信搜索小程序:沸点软件技术服务 2、打开沸点软件技术服务小程序 3、去抖音复制要去除水印的视频链接: 4、在沸点软件技术服务小程序粘贴复制的视频链接,点击开始解析: 这时候视 ... »

mac 手动安装nodejs搭建vue环境

为什么选择手动安装nodejs呢? 因为使用mac自动安装还要更新homebrew,还要安装xcode tool, 太费劲了,不如手动安装, 卸载起来也方便 再一个, 我是后台开发者, 对前端页面, 能整,但是越简单越好. 我的追求, 简单实用. 1. 访问nodejs官网,点击Current 区域 ... »

vue2 响应式细节

#### data 中的数据是如何处理的? 每一次实例化一个组件,都会调用 initData 然后调用 observe 方法,observe 方法调用了 new Observer(value), 并且返回 `__ob__` 。 在 new Observer 中做了两件事: 1. 把当前实例挂载到数据 ... »

Vue2.0 多种组件传值方法-不过如此的 Vuex

在vue项目中了解组件间通讯很重要,也是最基础的面试题,可以大致总结为以下几种情况和方法: 一、父向子传值 父 to 子 :通过动态绑定属性的方式,子组件在props中去接收,占为已用 // father.vue <child :name="name" /> data() { return { na ... »

Spring Cloud实战: 基于Spring Cloud Gateway + vue-element-admin 实现的RBAC权限管理系统,实现网关对RESTful接口方法权限和自定义Vue指令对按钮权限的细粒度控制

本篇通过实战的方式讲述如何基于Spring Cloud Gateway + vue-element-admin技术设计一套符合RBAC规范的权限管理系统,通过网关就可以轻易实现RESTful接口方法细粒度的控制,无需将Spring Security模块引入各个微服务;以及使用Vue的自定义指令在组件... ... »

Vue3.0新特性

Vue3.0新特性 Vue3.0的设计目标可以概括为体积更小、速度更快、加强TypeScript支持、加强API设计一致性、提高自身可维护性、开放更多底层功能。 描述 从Vue2到Vue3在一些比较重要的方面的详细对比。 生命周期的变化 Vue2 -> Vue3 beforeCreate -> se ... »

VUE 3.0 初体验之路

在2020年9月中旬,vue.js发布了3.0正式版,在不久的将来,VUE3.0 也终将成为大前端的必然趋势, 环境搭建 node 版本要求: Node.js8.9 或更高版本 ,输入 node -v 查看node版本 vue-cli 版本:达到 vue-cli4.5.0 以上,可创建vue3.0的 ... »

封装Vue Element的可编辑table表格组件

前一段时间,有博友在我那篇封装Vue Element的table表格组件的博文下边留言说有没有那种“表格行内编辑”的封装组件,我当时说我没有封装过这样的组件,因为一直以来在实际开发中也没有遇到过这样的需求,但我当时给他提供了一个思路。时间过去了这么久,公司的各种需求也不停地往外冒,什么地图图表、表格... ... »

Vue-Router

vue-router拥有的功能: 支持h5历史模式或者hash模式 支持嵌套路由 支持路由参数 支持编程式路由 支持命名式路由 如何使用vue-router 1.使用router-link标签,在HTML中将转化为a标签,属性to为跳转的位置,HTML中为href 2.使用路由占位符,用于渲染路由数 ... »

Vue中组件间通信的方式

Vue中组件间通信的方式 Vue中组件间通信包括父子组件、兄弟组件、隔代组件之间通信。 props $emit 这种组件通信的方式是我们运用的非常多的一种,props以单向数据流的形式可以很好的完成父子组件的通信,所谓单向数据流,就是数据只能通过props由父组件流向子组件,而子组件并不能通过修改p ... »