- 缘起最近做的一个小需求涉及到排序，界面如下所示：因为项目是使用vue的，所以实现方式很简单，视图部分不用管，本质上就是操作数组，代码如下：{ // 上移 moveUp (i) { // 把位置i的元素移到i-1上 let tmp = this.form.replayList.splice(i, 1) this.form.replayList.s... 缘起最近做的一个小需求涉及到排序，界面如下所示：因为项目是使用vue的，所以实现方式很简单，视图部分不用管，本质上就是操作数组，代码如下：{ // 上移 moveUp (i) { // 把位置i的元素移到i-1上 let tmp = this.form.replayList.splice(i, 1) this.form.replayList.s...
- 在通读了vue的官网文档后，我记录下了如下这些相对于2.x的变化之处。 1.创建应用实例的变化之前一般是这样：let app = new Vue({ // ...一些选项 template: '',// 字符串模板 render: h => h(App)// 单文件情况下})let vm = app.$mount('#app')app === vm// true而现在变成这样：import ... 在通读了vue的官网文档后，我记录下了如下这些相对于2.x的变化之处。 1.创建应用实例的变化之前一般是这样：let app = new Vue({ // ...一些选项 template: '',// 字符串模板 render: h => h(App)// 单文件情况下})let vm = app.$mount('#app')app === vm// true而现在变成这样：import ...
- 前言大家好，我是CoderBin，最近在写Vue的项目，由于有一段时间没写的原因，对Vue中的修饰符有些生疏了。所以花了点时间去看了下文档，所以，本文将总结关于Vue中的一些常见的修饰符和写法，希望对大家有所帮助,谢谢。如果文中有不对、疑惑的地方，欢迎在评论区留言指正🌻 一、修饰符是什么在Vue中，修饰符处理了许多DOM事件的细节，让我们不再需要花大量的时间去处理这些烦恼的事情，而能有更... 前言大家好，我是CoderBin，最近在写Vue的项目，由于有一段时间没写的原因，对Vue中的修饰符有些生疏了。所以花了点时间去看了下文档，所以，本文将总结关于Vue中的一些常见的修饰符和写法，希望对大家有所帮助,谢谢。如果文中有不对、疑惑的地方，欢迎在评论区留言指正🌻 一、修饰符是什么在Vue中，修饰符处理了许多DOM事件的细节，让我们不再需要花大量的时间去处理这些烦恼的事情，而能有更...
- 支持预处理器除了基本的html、js和css，作为一个强大的工具，我们有必要支持一下常用的预处理器，比如html的pug，js的TypeScript及css的less等，实现思路相当简单，加载对应预处理器的转换器，然后转换一下即可。 动态切换编辑器语言Monaco Editor想要动态修改语言的话我们需要换一种方式来设置文档，上文我们是创建编辑器的同时直接把语言通过language选项传递... 支持预处理器除了基本的html、js和css，作为一个强大的工具，我们有必要支持一下常用的预处理器，比如html的pug，js的TypeScript及css的less等，实现思路相当简单，加载对应预处理器的转换器，然后转换一下即可。 动态切换编辑器语言Monaco Editor想要动态修改语言的话我们需要换一种方式来设置文档，上文我们是创建编辑器的同时直接把语言通过language选项传递...
- @[toc] 1 推荐信息 1.1 思路看了这个gif后，可以清楚的看到产生了三个动画效果：图片"拉近"，"了解更多"从下往上显示出来，阴影。我看了华为官网的源代码，发现图片本身就是有一个mask的，这样能让图片看起来暗一些，也就意味着，当鼠标进入的时候，只需要让mask的背景颜色更深一些，就实现了阴影的效果。至于图片"拉近"，我早就写过了，无非是把图片放大，然后超出盒子的不显示，这个也容易... @[toc] 1 推荐信息 1.1 思路看了这个gif后，可以清楚的看到产生了三个动画效果：图片"拉近"，"了解更多"从下往上显示出来，阴影。我看了华为官网的源代码，发现图片本身就是有一个mask的，这样能让图片看起来暗一些，也就意味着，当鼠标进入的时候，只需要让mask的背景颜色更深一些，就实现了阴影的效果。至于图片"拉近"，我早就写过了，无非是把图片放大，然后超出盒子的不显示，这个也容易...
- “我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第2篇文章，点击查看活动详情”上一篇Vite入门从手写一个乞丐版的Vite开始（上）我们已经成功的将页面渲染出来了，这一篇我们来简单的实现一下热更新的功能。所谓热更新就是修改了文件，不用刷新页面，页面的某个部分就自动更新了，听着似乎挺简单的，但是要实现一个很完善的热更新还是很复杂的，要考虑的情况很多，所以本文只会实现一个最基础的热更新效... “我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第2篇文章，点击查看活动详情”上一篇Vite入门从手写一个乞丐版的Vite开始（上）我们已经成功的将页面渲染出来了，这一篇我们来简单的实现一下热更新的功能。所谓热更新就是修改了文件，不用刷新页面，页面的某个部分就自动更新了，听着似乎挺简单的，但是要实现一个很完善的热更新还是很复杂的，要考虑的情况很多，所以本文只会实现一个最基础的热更新效...
- “我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第1篇文章，点击查看活动详情”Vite是什么就不用笔者多说了，用过Vue的朋友肯定都知道，本文会通过手写一个非常简单的乞丐版Vite来了解一下Vite的基本实现原理，参考的是Vite最早的版本（vite-1.0.0-rc.5版本，Vue版本为3.0.0-rc.10）实现的，现在已经是3.x的版本了，为什么不直接参考最新的版本呢，因为一上... “我报名参加金石计划1期挑战——瓜分10万奖池，这是我的第1篇文章，点击查看活动详情”Vite是什么就不用笔者多说了，用过Vue的朋友肯定都知道，本文会通过手写一个非常简单的乞丐版Vite来了解一下Vite的基本实现原理，参考的是Vite最早的版本（vite-1.0.0-rc.5版本，Vue版本为3.0.0-rc.10）实现的，现在已经是3.x的版本了，为什么不直接参考最新的版本呢，因为一上...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第10天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第十篇，也是最后一篇，读完本篇，可以了解到如何通过创建一个Vue3响应式对象就可以轻松实现国际化的需求。Varlet组件库支持多语言切换，使用也很简单：本文会从源码角度来看一下它是如何实现的，希望给你提供一点思路。如上图所示，主要就是提供了三个方法，不过在了... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第10天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第十篇，也是最后一篇，读完本篇，可以了解到如何通过创建一个Vue3响应式对象就可以轻松实现国际化的需求。Varlet组件库支持多语言切换，使用也很简单：本文会从源码角度来看一下它是如何实现的，希望给你提供一点思路。如上图所示，主要就是提供了三个方法，不过在了...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第9天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第九篇，读完本篇，可以了解到如何使用一个div创建一个点击的水波效果。Varlet组件库提供了一个使元素点击时生成水波扩散效果的指令：<template> <div v-ripple>点击</div></template>接下来就从源码角度看看它是如何实现的... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第9天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第九篇，读完本篇，可以了解到如何使用一个div创建一个点击的水波效果。Varlet组件库提供了一个使元素点击时生成水波扩散效果的指令：<template> <div v-ripple>点击</div></template>接下来就从源码角度看看它是如何实现的...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第7天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第七篇，读完本篇，可以了解到如何通过unplugin-vue-components插件来为你的组件库实现按需引入。 手动引入前面的文章中我们介绍过Varlet组件库的打包流程，最后会打包成几种格式，其中module和commonjs格式都不会把所有组件的代码打... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第7天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第七篇，读完本篇，可以了解到如何通过unplugin-vue-components插件来为你的组件库实现按需引入。 手动引入前面的文章中我们介绍过Varlet组件库的打包流程，最后会打包成几种格式，其中module和commonjs格式都不会把所有组件的代码打...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第5天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第五篇，读完本文你可以了解到如何通过编写一个Vite插件来支持使用md文件直接作为路由组件。之前文档站点的搭建里我们介绍了路由的动态生成逻辑，其中说到了文档是使用Markdown格式编写的，并且还直接在路由文件里使用md文件作为路由组件：路由就是路径到组件的映... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第5天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第五篇，读完本文你可以了解到如何通过编写一个Vite插件来支持使用md文件直接作为路由组件。之前文档站点的搭建里我们介绍了路由的动态生成逻辑，其中说到了文档是使用Markdown格式编写的，并且还直接在路由文件里使用md文件作为路由组件：路由就是路径到组件的映...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第4天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第四篇，读完本篇，可以了解到如何使用Vite的Api接口来启动服务、如何动态生成多语言的页面路由。Varlet的文档网站其实就是一个Vue项目，整体分成两个单独的页面：文档页面及手机预览页面。网站源代码文件默认是放在varlet-cli目录下，也就是脚手架的包... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第4天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第四篇，读完本篇，可以了解到如何使用Vite的Api接口来启动服务、如何动态生成多语言的页面路由。Varlet的文档网站其实就是一个Vue项目，整体分成两个单独的页面：文档页面及手机预览页面。网站源代码文件默认是放在varlet-cli目录下，也就是脚手架的包...
- 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第1天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第一篇Vue开源的组件库有很多，基本各个大厂都会做一个，所以作为个人再重复造轮子其实意义也不是很大，但是笔者对于如何设计一个Vue组件库还是挺感兴趣的。不同的组件库架构肯定有所不同，不过大体思路应该都差不多，笔者在众多组件库中挑选了Varlet 来进行剖析，V... 持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第1天，点击查看活动详情本文为Varlet组件库源码主题阅读系列第一篇Vue开源的组件库有很多，基本各个大厂都会做一个，所以作为个人再重复造轮子其实意义也不是很大，但是笔者对于如何设计一个Vue组件库还是挺感兴趣的。不同的组件库架构肯定有所不同，不过大体思路应该都差不多，笔者在众多组件库中挑选了Varlet 来进行剖析，V...
- 1 分析根据华为网页的布局，我们大体上可以将其划分为7个盒子，如下，由于写一个这样的网页再加上部分动态效果，需要的时间很长，本篇博客只记录了div1、div2、div3的静态效果+轮播图的实现。 2 顶部盒子的实现想要实现的正是最上部那个黑色的圆框 2.1 思路我的思路很简单，用四个盒子，其中最大的盒子也就是整个黑色框，大盒子里面包裹着小盒子，每个小盒子对应一个字段（集团网站、选择区域/语... 1 分析根据华为网页的布局，我们大体上可以将其划分为7个盒子，如下，由于写一个这样的网页再加上部分动态效果，需要的时间很长，本篇博客只记录了div1、div2、div3的静态效果+轮播图的实现。 2 顶部盒子的实现想要实现的正是最上部那个黑色的圆框 2.1 思路我的思路很简单，用四个盒子，其中最大的盒子也就是整个黑色框，大盒子里面包裹着小盒子，每个小盒子对应一个字段（集团网站、选择区域/语...
- 在一般项目中这个问题不会出现，但是在二般项目中还是会出现类似问题，就比如：医院项目中，表单接口是：http://192.168.2.1:900而有一个登录接口，后台请求地址是http://192.168.2.2:900这种情况下怎么办呢？虽然有的伙伴说，老师，你说的这个问题一般在我这里碰不到的，毕竟我们就一个服务器。话虽没错。线上一个服务器，那如果说这是在内网环境下部署呢，就比如医院项目中，... 在一般项目中这个问题不会出现，但是在二般项目中还是会出现类似问题，就比如：医院项目中，表单接口是：http://192.168.2.1:900而有一个登录接口，后台请求地址是http://192.168.2.2:900这种情况下怎么办呢？虽然有的伙伴说，老师，你说的这个问题一般在我这里碰不到的，毕竟我们就一个服务器。话虽没错。线上一个服务器，那如果说这是在内网环境下部署呢，就比如医院项目中，...
上滑加载中
推荐直播
-
香橙派AIpro的远程推理框架与实验案例2025/07/04 周五 19:00-20:00
郝家胜 -华为开发者布道师-高校教师
AiR推理框架创新采用将模型推理与模型应用相分离的机制，把香橙派封装为AI推理黑盒服务，构建了分布式远程推理框架，并提供多种输入模态、多种输出方式以及多线程支持的高度复用框架，解决了开发板环境配置复杂上手困难、缺乏可视化体验和资源稀缺课程受限等痛点问题，真正做到开箱即用，并支持多种笔记本电脑环境、多种不同编程语言，10行代码即可体验图像分割迁移案例。
回顾中 -
鸿蒙端云一体化应用开发2025/07/10 周四 19:00-20:00
倪红军 华为开发者布道师-高校教师
基于鸿蒙平台终端设备的应用场景越来越多、使用范围越来越广。本课程以云数据库服务为例，介绍云侧项目应用的创建、新建对象类型、新增存储区及向对象类型中添加数据对象的方法，端侧（HarmonyOS平台）一体化工程项目的创建、云数据资源的关联方法及对云侧数据的增删改查等操作方法，为开发端云一体化应用打下坚实基础。
即将直播
热门标签