- 简介在大型应用里，有些组件可能一开始并不显示，只有在特定条件下才会渲染，那么这种情况下该组件的资源其实不需要一开始就加载，完全可以在需要的时候再去请求，这也可以减少页面首次加载的资源体积，要在Vue中使用异步组件也很简单：// AsyncComponent.vue<template> <div>我是异步组件的内容</div></template><script>export defaul... 简介在大型应用里，有些组件可能一开始并不显示，只有在特定条件下才会渲染，那么这种情况下该组件的资源其实不需要一开始就加载，完全可以在需要的时候再去请求，这也可以减少页面首次加载的资源体积，要在Vue中使用异步组件也很简单：// AsyncComponent.vue<template> <div>我是异步组件的内容</div></template><script>export defaul...
- 我司有一个工作台搭建产品，允许通过拖拽小部件的方式来搭建一个工作台页面，平台内置了一些常用小部件，另外也允许自行开发小部件上传使用，本文会从实践的角度来介绍其实现原理。ps.本文项目使用Vue CLI创建，所用的Vue版本为2.6.11，webpack版本为4.46.0。 创建项目首先使用Vue CLI创建一个项目，在src目录下新建一个widgets目录用来存放小部件：一个小部件由一个Vu... 我司有一个工作台搭建产品，允许通过拖拽小部件的方式来搭建一个工作台页面，平台内置了一些常用小部件，另外也允许自行开发小部件上传使用，本文会从实践的角度来介绍其实现原理。ps.本文项目使用Vue CLI创建，所用的Vue版本为2.6.11，webpack版本为4.46.0。 创建项目首先使用Vue CLI创建一个项目，在src目录下新建一个widgets目录用来存放小部件：一个小部件由一个Vu...
- 通过Vue CLI可以方便的创建一个Vue项目，但是对于实际项目来说还是不够的，所以一般都会根据业务的情况来在其基础上添加一些共性能力，减少创建新项目时的一些重复操作，本着学习和分享的目的，本文会介绍一下我们Vue项目的前端架构设计，当然，有些地方可能不是最好的方式，毕竟大家的业务不尽相同，适合你的就是最好的。除了介绍基本的架构设计，本文还会介绍如何开发一个Vue CLI插件和preset预... 通过Vue CLI可以方便的创建一个Vue项目，但是对于实际项目来说还是不够的，所以一般都会根据业务的情况来在其基础上添加一些共性能力，减少创建新项目时的一些重复操作，本着学习和分享的目的，本文会介绍一下我们Vue项目的前端架构设计，当然，有些地方可能不是最好的方式，毕竟大家的业务不尽相同，适合你的就是最好的。除了介绍基本的架构设计，本文还会介绍如何开发一个Vue CLI插件和preset预...
- 初始化结束后，如果存在el属性，那么最后会进行挂载操作：if (vm.$options.el) { vm.$mount(vm.$options.el)}$mount方法是个区分平台的方法，web平台的如下：const mount = Vue.prototype.$mountVue.prototype.$mount = function ( el, hydrating) { el ... 初始化结束后，如果存在el属性，那么最后会进行挂载操作：if (vm.$options.el) { vm.$mount(vm.$options.el)}$mount方法是个区分平台的方法，web平台的如下：const mount = Vue.prototype.$mountVue.prototype.$mount = function ( el, hydrating) { el ...
- 这一篇我们来看一下Vue核心的响应性原理，在上一篇我们知道了初始化时Vue会把data选项的数据递归的转换成响应性的数据，具体来说就是给数组和对象创建一个关联的Observer实例，然后对于数组，会拦截它的所有方法，以此来监听数组的变化，对于普通对象，会遍历它自身所有可枚举的属性，将其转换成setter和getter形式，以此来监听某个属性的变化，为什么要这么做呢，我们来看一下。首先简单介绍... 这一篇我们来看一下Vue核心的响应性原理，在上一篇我们知道了初始化时Vue会把data选项的数据递归的转换成响应性的数据，具体来说就是给数组和对象创建一个关联的Observer实例，然后对于数组，会拦截它的所有方法，以此来监听数组的变化，对于普通对象，会遍历它自身所有可枚举的属性，将其转换成setter和getter形式，以此来监听某个属性的变化，为什么要这么做呢，我们来看一下。首先简单介绍...
- 上一节我们大致看了一下实例化Vue时所做的事情，其中初始化data选项的部分我们跳过了，这一篇我们详细来了解一下。 初始化data选项先看一下初始化data的方法：function initData(vm) { let data = vm.$options.data // 获取data对象 data = vm._data = typeof data === 'function' ? ... 上一节我们大致看了一下实例化Vue时所做的事情，其中初始化data选项的部分我们跳过了，这一篇我们详细来了解一下。 初始化data选项先看一下初始化data的方法：function initData(vm) { let data = vm.$options.data // 获取data对象 data = vm._data = typeof data === 'function' ? ...
- 上一篇我们看了引入Vue时都有哪些操作，这一篇我们来看一下new一个Vue实例时会发生什么，测试代码如下：<div id="app"></div>const app = new Vue({ el: '#app', template: `<h1>{{text}}</h1>`, data: { text: 'hello' }})根据上一篇的最后我们知道Vue... 上一篇我们看了引入Vue时都有哪些操作，这一篇我们来看一下new一个Vue实例时会发生什么，测试代码如下：<div id="app"></div>const app = new Vue({ el: '#app', template: `<h1>{{text}}</h1>`, data: { text: 'hello' }})根据上一篇的最后我们知道Vue...
- 调试阅读源码最好的方式还是通过调试，否则很容易在源码里迷失方向，本文提供了一种方便的方式来调试：git clone https://github.com/wanglin2/learn_vue_2.6.0.gitcd learn_vue_2.6.0npx http-server -e js -c-1然后访问：http://【你的ip:端口】/examples/index.html即可打开测试... 调试阅读源码最好的方式还是通过调试，否则很容易在源码里迷失方向，本文提供了一种方便的方式来调试：git clone https://github.com/wanglin2/learn_vue_2.6.0.gitcd learn_vue_2.6.0npx http-server -e js -c-1然后访问：http://【你的ip:端口】/examples/index.html即可打开测试...
- 相比Vue2，Vue3的官方文档中新增了一个在线Playground：打开是这样的：相当于让你可以在线编写和运行Vue单文件组件，当然这个东西也是开源的，并且发布为了一个npm包，本身是作为一个Vue组件，所以可以轻松在你的Vue项目中使用：<script setup>import { Repl } from '@vue/repl'import '@vue/repl/style.css'</... 相比Vue2，Vue3的官方文档中新增了一个在线Playground：打开是这样的：相当于让你可以在线编写和运行Vue单文件组件，当然这个东西也是开源的，并且发布为了一个npm包，本身是作为一个Vue组件，所以可以轻松在你的Vue项目中使用：<script setup>import { Repl } from '@vue/repl'import '@vue/repl/style.css'</...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第2天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第二篇，读完本篇，你可以了解到如何将一个Vue3组件库打包成各种格式上一篇里提到了启动服务前会先进行一下组件库的打包，运行的命令为：varlet-cli compile显然是varlet-cli包提供的一个命令：处理函数为compile，接下来我们详细看一下这... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第2天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第二篇，读完本篇，你可以了解到如何将一个Vue3组件库打包成各种格式上一篇里提到了启动服务前会先进行一下组件库的打包，运行的命令为：varlet-cli compile显然是varlet-cli包提供的一个命令：处理函数为compile，接下来我们详细看一下这...
- ==Vue 是一套前端框架，免除原生JavaScript中的DOM操作，简化书写。== 我们之前也学习过后端的框架 `Mybatis` ，`Mybatis` 是用来简化 `jdbc` 代码编写的；而 `VUE` 是前端的框架，是用来简化 `JavaScript` 代码编写的。前一天我们做了一个综合性的案例，里面进行了大量的DOM操作，如下 ==Vue 是一套前端框架，免除原生JavaScript中的DOM操作，简化书写。== 我们之前也学习过后端的框架 `Mybatis` ，`Mybatis` 是用来简化 `jdbc` 代码编写的；而 `VUE` 是前端的框架，是用来简化 `JavaScript` 代码编写的。前一天我们做了一个综合性的案例，里面进行了大量的DOM操作，如下
- 1 什么是前后端分离前后端分离是目前互联网开发中比较广泛使用的开发模式，主要是将前端和后端的项目业务进行分离，可以做到更好的解耦合，前后端之间的交互通过xml或json的方式，前端主要做用户界面的渲染，后端主要负责业务逻辑和数据的处理。 2 Spring Boot后端搭建 2.1 Mapper层请参阅这篇文章https://blog.csdn.net/Mr_YanMingXin/artic... 1 什么是前后端分离前后端分离是目前互联网开发中比较广泛使用的开发模式，主要是将前端和后端的项目业务进行分离，可以做到更好的解耦合，前后端之间的交互通过xml或json的方式，前端主要做用户界面的渲染，后端主要负责业务逻辑和数据的处理。 2 Spring Boot后端搭建 2.1 Mapper层请参阅这篇文章https://blog.csdn.net/Mr_YanMingXin/artic...
- @TOC 前言前面一篇文章Vue开发历程—音乐播放器，实现了播放音乐，以及基本的布局。但是进度条没有实现同步，本文即介绍进度条的实现。 一、效果图 二、心路历程 1、elementUI 滑块的使用 <div class="block" style="margin-top:5px"> <el-slider v-model="value" @change="updateSlideTime()" ... @TOC 前言前面一篇文章Vue开发历程—音乐播放器，实现了播放音乐，以及基本的布局。但是进度条没有实现同步，本文即介绍进度条的实现。 一、效果图 二、心路历程 1、elementUI 滑块的使用 <div class="block" style="margin-top:5px"> <el-slider v-model="value" @change="updateSlideTime()" ...
- 大家好，我是CoderBin 前言面试官：“你说说Vue中的组件和插件有什么区别？”紧张的萌新：“vue组件是封装可复用的UI结构，插件好像是用vue.use()…”面试官：“…”······又来到了面试官系列，这次将带大家回顾一下Vue中的组件与插件的相关内容，帮助同学们在面试中更加游刃有余，希望对大家有所帮助，谢谢。如果文中有不对、疑惑的地方，欢迎在评论区留言指正🌻 一、组件概念回顾以... 大家好，我是CoderBin 前言面试官：“你说说Vue中的组件和插件有什么区别？”紧张的萌新：“vue组件是封装可复用的UI结构，插件好像是用vue.use()…”面试官：“…”······又来到了面试官系列，这次将带大家回顾一下Vue中的组件与插件的相关内容，帮助同学们在面试中更加游刃有余，希望对大家有所帮助，谢谢。如果文中有不对、疑惑的地方，欢迎在评论区留言指正🌻 一、组件概念回顾以...
- vue快速入门---高速版 vue快速入门---高速版
上滑加载中
推荐直播
-
香橙派AIpro的远程推理框架与实验案例2025/07/04 周五 19:00-20:00
郝家胜 -华为开发者布道师-高校教师
AiR推理框架创新采用将模型推理与模型应用相分离的机制，把香橙派封装为AI推理黑盒服务，构建了分布式远程推理框架，并提供多种输入模态、多种输出方式以及多线程支持的高度复用框架，解决了开发板环境配置复杂上手困难、缺乏可视化体验和资源稀缺课程受限等痛点问题，真正做到开箱即用，并支持多种笔记本电脑环境、多种不同编程语言，10行代码即可体验图像分割迁移案例。
即将直播 -
鸿蒙端云一体化应用开发2025/07/10 周四 19:00-20:00
倪红军 华为开发者布道师-高校教师
基于鸿蒙平台终端设备的应用场景越来越多、使用范围越来越广。本课程以云数据库服务为例，介绍云侧项目应用的创建、新建对象类型、新增存储区及向对象类型中添加数据对象的方法，端侧（HarmonyOS平台）一体化工程项目的创建、云数据资源的关联方法及对云侧数据的增删改查等操作方法，为开发端云一体化应用打下坚实基础。
即将直播
热门标签