【译】Vue 官方周报:动态插槽名技巧~VueConf 2023 预热!(2023 年第 44 周)

大家好,这里是大家的林语冰,您现在收看的是 2023 年第 44 周 Vue 官方的技术周报。

免责声明

本文属于是语冰的直男翻译了属于是,仅供粉丝参考,视频解说请临幸 人猫神话@bilibili,英文原味版请临幸 Weekly Vue News

Vue 技术栈

Vue 3 组合式组件 vs 无渲染组件

"无渲染组件(Renderless Components)通常适用于为子组件提供某些功能,而组合式组件(Composables Components)适用于为一个或多个组件提供有状态逻辑。"


Vue 显示和隐藏表单元素

当开发表单时,根据选中选项显示和隐藏各种字段的需求司空见惯。

本文解释了在 @vuejs 中按需显示或隐藏表单元素的方法。


诉诸 Vue 开发过滤表组件

在本视频中,您将学习诉诸 VUe 3 及其组合式 API 以使用计算属性、事件、fetch 请求和 emits(发射)来构建组件,该组件的行为类似于过滤器和搜索表。


@NativeScrip-Use/Vue

NativeScript-Use/Vue 基于 VueUse,它是 NativeScript-Vue3 的工具集。

Nuxt 技术栈

Nuxt 中的静态增生

本文将辅助您理解 SSG(静态网站生成) app 的问题,使用 ISR(Incremental Static Regeneration)解决这些问题的方法,在 Nuxt 中实现 ISR 以及自定义 Nuxt 的渲染来满足您的需求的方法。


Nuxt 3 性能(第一部分)

在本文中,您将了解 Nuxt 3 app 的性能,以及利用其超能力来优化 app 性能的方法。


让您的锚标签的行为类似 Nuxt Links

我们中的大多数人不得不从 CMS 或 API 嵌入 HTML。虽然但是,锚标签会重载整个页面。

在自定义指令的辅助下,您可以让锚标签拥有类似 NuxtLink 组件的行为!

多人活动

VueConf 多伦多

2023 年 11 月 9-10 日,加拿大多伦多

完整流程请临幸 http://vuetoronto.com/schedule


Vuejs 阿姆斯特丹 2024

2024 年 2 月 28-29 日,阿姆斯特丹


热评圣经

程序员的"成人礼"在于 ------ 当你意识到你一顿操作的代码毫无卵用时,你愿意果断白给及时止损。

Vue 奇技淫巧:动态插槽名

在这个 Vue 奇技淫巧中,我想向您表演在 Vue 中使用动态插槽名的方法。

这适用于诸如 多步表单(multi-step form)图表组件(table component) 等应用场景。

让我们来瞄一眼在运行时动态生成插槽的方法:

在您的父组件中,您现在可以使用 v-slot:[item.name] 语法为 items 数组中的任意元素动态生成插槽名:

除了 v-slot:[item.name],您还可以使用 #[item.name] 简写。

请在下面的 StackBlitz 项目中自己练习:

Open Demo(开放演示)

前端梗图

周边资讯

网页版 Photoshop 上线

诉诸 WebAssembly 和 Web 组件赋能。

网络现在已经足够给力,可以处理鲁棒的图像编辑器 Photoshop。


加速 JS 生态系统 ------ 聚合文件爆炸

聚合文件(Barrel 文件)通常会导致 JS 项目中的性能问题,大型项目尤其如此。

消灭聚合文件可以使一大坨任务运行优化 60-80%。


生产环境中保护 Node.js app 的最佳实践

若干最佳实践,包括但不限于设置安全 HTTP headers、实现速率限制和强制执行强身份验证策略。


测试金字塔万岁

瞄一眼某些当代测试策略并评估著名的测试金字塔的相关性。


理解 Cookies

一本关于 cookies 的优秀指南,值得一读。


VS Code 指南 ------ 解放生产力

在这个免费的 6 小时 VS Code 教程中,您将学习内置功能,最佳设置/扩展和工作流的使用方法,解放您的生产力。


Viselect

一个虚拟 DOM 选择库。

可以直接使用或与 React 或 Vue 集成。

您现在收看的是 Vue 官方周报,学废了的小伙伴可以点赞友情赞助本系列,我们礼拜天佛系拖更,欢迎关注和订阅最新动态。谢谢大家的彼芯,掰掰~

相关推荐
代码煮茶13 小时前
Vite 5.0 新特性深度解析:更快、更干净、更未来的前端构建利器
vue.js
Pu_Nine_917 小时前
IntersectionObserver 详解:封装 Vue 指令实现图片懒加载
前端·javascript·vue.js·性能优化
前端那点事18 小时前
Vue nextTick 超全解析|作用、使用场景、底层原理、Vue2/Vue3区别
前端·vue.js
前端那点事18 小时前
Vue面试高频:子组件能直接修改父组件数据吗?单向数据流原理+正确写法全覆盖
前端·vue.js
前端那点事18 小时前
为什么 Vue 的 template 标签不能用 v-show?底层机制+踩坑复盘+生产级解决方案
前端·vue.js
北风toto19 小时前
为什么 IntelliJ IDEA Community 无法开发 Vue?——附解决方案
java·vue.js·intellij-idea
跟着珅聪学java19 小时前
Element UI 的 Tabs 标签页开发教程
javascript·vue.js·elementui
jiayong2320 小时前
前端面试题库 - Vue框架篇
前端·vue.js·面试
三*一21 小时前
Mapbox GL JS 前端多边形分割实战:从踩坑到优雅实现
开发语言·前端·javascript·vue.js
xChive21 小时前
前端请求取消:用 AbortController 从 fetch 到 axios
前端·vue.js·axios·fetch·abortcontroller