VUE3.0关于vscode保存时script标签上写的setup自动消失的问题

最新推荐文章于 2023-07-12 14:21:13 发布
最新推荐文章于 2023-07-12 14:21:13 发布
阅读量1.1k 收藏 2
点赞数 1
分类专栏： vue3.0 文章标签： vscode 前端 javascript vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HarleyPear/article/details/125508877
版权

VUE3.0关于vscode保存时script标签上写的setup自动消失的问题

最近换了vscode写代码，结果在保存的时候，写在script标签上的setup自动丢失了，怀疑是某个格式化插件导致的，排查了一下之后发现是这个：
在这里插入图片描述
禁用掉之后上述问题就解决了，但是具体原因是什么没去探究。这个插件还挺好用的，就此弃用有点可惜。如果有大佬发现真正原因和解决办法欢迎交流。

HarleyPear
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
vue3.0pdf在线预览
02-25
Vue3.0是一款备受瞩目的前端JavaScript框架的最新版本，由尤雨溪领导的团队开发。Vue3.0带来了许多性能优化和新特性，旨在提高开发效率和应用性能。PDF在线预览是Web应用程序中常见的一项功能，允许用户在不下载文件...
Vue3.0配置多页面应用
03-17
Vue3.0是一个备受瞩目的前端框架更新，它引入了许多新特性和性能优化，使得开发者在构建复杂Web应用时更加高效。"Vue3.0配置多页面应用"是指利用Vue3.0框架来开发包含多个独立入口的Web应用程序，每个入口对应一个...
解决`VScode在不自动保存情况下，手动保存，加分号`的问题
zhongqingtian的博客
07-02 732
解决`VScode在不自动保存情况下，手动保存，加分号`的问题
Vue3 - setup script
IT界中的一枝梅的博客
10-20 697
前言 Vue3其中比较大的一个特性就是setup方法，可以让我们非常直观和方便的组合我们的业务逻辑和hooks。在setup里面返回的变量可以直接在template里面使用。大多数情况下，我们的大部分逻辑都集中在setup方法里面，所以官方提供了一个实验性的写法，直接在script里面写setup的内容，即：setup script。 使用 我们之前的组件可能是这样的： <template> <div class="flex items-center justify-center h-
(vue)保存代码后表格数据及页码丢失
nyf_unknow的博客
08-19 196
方法：给表格数据和页码增加监听。
vue3无法使用语法糖setup
weixin_48927323的博客
06-06 768
卸载这个东西安装
vue组件下面的dom消失
yuru974882032的博客
08-15 825
使用组件时必须有结束标签 <remark-input th:value="${entity?.remark}"/>//有些时候会干扰到该标签下面的dom <remark-input th:value="${entity?.remark}"></remark-input>//需要改成这样
【Vue3.0】- 2 setup函数
YhWyl527的博客
11-24 788
1、setup函数是处于 生命周期函数 beforeCreate 和 Created 两个钩子函数之间的函数 也就说在 setup函数中是无法 使用 data 和 methods 中的数据和方法的 　　 2、setup函数是 CompositionAPI（组合API）的入口 　　 3、在setup函数中定义的变量和方法最后都是需要 return 出去的 不然无法再模板中使用** 注意点： 1、由于在执行 setup函数的时候，还没有执行 Created 生命周期方法，所以在 setup 函数中，无法使用.
解决vscode 中保存后html自动格式化的问题
12-28
最近几天更新了 vsCode 的版本，目前所用的版本号为：1.43。其实每次更新 vsCode 版本号并没有感受到有什么明显的变化，只是日常顺手更新而已。而这一次 vsCode 真的是帮了我一个“大忙”。 众所周知我们写 html ...
解决vscode进行vue格式化,会自动补分号和双引号的问题
01-18
在使用vscode开发vue项目时，严格检查让人有点烦恼，必然需要一款可以自动格式化的插件进行快速严格检查的格式化。vscode插件会推荐使用 vetur 插件才会进行vue文件的识别与高亮。 安装完 vetur 后确实是可以对 vue...
vue3.0中setup使用(两种用法)
01-21
　可以确定的是 Vue3.0 是兼容 Vue2.x 版本的 也就是说我们再日常工作中 可以在 Vue3 中使用 Vue2.x 的相关语法 但是当你真正开始使用 Vue3 写项目时 你会发现他比 Vue2.x 方便的多 　Vue3 的一大特性函数 —- setup...
解决vsCode格式化vue代码的问题
zhiyikeji的博客
03-05 1503
1.首先安装两个必要的插件: eslint Vetur 2.配置 eslint,按如下步骤打开配置文件: 文件-&amp;gt;首选项-&amp;gt;设置，在搜索设置中输入 eslint,如图: 点击图中红色勾选的按钮之后,来到下图所示的位置: 点击红色勾选的设置: 进行如下设置: { &quot;workbench.iconTheme&quot;: &quot;material-icon-theme&quot;, &quot;w
vscode 快速生成 Vue2、vue3(setup函数)、vue3(setup语法糖)模板
放弃不难，但坚持一定很酷！
04-28 711
vscode 快速生成 Vue2、vue3(setup函数)、vue3(setup语法糖)模板
vscode vue文件 script标签不高亮显示
qq_45600228的博客
07-07 388
vscode vue文件 script标签不高亮显示
vue3 setup语法糖请注意在script标签里加setup，不用return
热门推荐
qq_54753561的博客
10-29 1万+
虽然Composition API用起来已经非常方便了，但是我们还是有很烦的地方，比如 组件引入了还要注册 属性和方法都要在setup函数中返回，有的时候仅一个return就十几行甚至几十行 不想写啊怎么办 好办，Vue3官方提供了script setup语法糖 只需要在script标签中添加setup，组件只需引入不用注册，属性和方法也不用返回，setup函数也不需要，甚至export default都不用写了，不仅是数据，计算属性和方法，甚至是自定义指令也可以在我们的te
vue3 中的script setup
weixin_47259205的博客
08-06 9182
script setup <script setup>是 Vue3 新出的语法糖，类型是Vue的Git RFC中的建议。需要明确的是，这并不是要完全替代任何当前写法。其目的是为开发人员提供更简洁的语法，简化使用Composition API时冗长的模板代码，以编写其单个文件组件。 在不使用 <script setup>, 我们代码是： <template> <h1 v-text="count"></h1> <p v-text=
Vue3之script-setup全面解析
Sugar0219的博客
05-11 777
vue3 script-setup 全面解析
在VSCODE编辑器是用ctrl+c和ctrl+s（复制粘贴）失效怎么办
最新发布
BIlly Feng的博客
07-12 3884
有时我们在开发过程中，由于使用vsccode太长时间导致复制ctrl+c和ctrl+s会失效，之前我的处理方式是重启浏览器，但有时候这样太耗时间了，但发现一个方法可以解决，就是刷新下编辑器的timeline就行，如下图：
Vue3.0最新动态：script-setup 定稿，部分实验性 API 将弃用
小生方勤
07-16 2913
最近一段时间挺忙，对 Vue 3.0 的更新记录看的比较少，今天看了一下 release 记录，发现最新的 2 个小版本对 script-setup 这个新特性改动还算蛮大的，之前的用法都...
vue3.0中script标签添加setup ，生命周期该怎样写？
06-06
在Vue 3.0中，使用`<script setup>`标签来编写组件的逻辑。`<script setup>`标签是Vue 3.0中的新特性，它可以更好地支持组合式 API，并且可以自动地将组件的 props、data、computed、methods等等都声明为响应式的变量。 在`<script setup>`标签中，不需要再像Vue 2.x中那样定义生命周期函数，而是使用特定的API来实现相同的功能。以下是Vue 3.0中常用的生命周期函数及其对应的API： - `beforeCreate`: 可以使用`onBeforeMount`函数来代替 - `created`: 可以使用`onMounted`函数来代替 - `beforeMount`: 可以使用`onBeforeMount`函数来代替 - `mounted`: 可以使用`onMounted`函数来代替 - `beforeUpdate`: 可以使用`onBeforeUpdate`函数来代替 - `updated`: 可以使用`onUpdated`函数来代替 - `beforeUnmount`: 可以使用`onBeforeUnmount`函数来代替 - `unmounted`: 可以使用`onUnmounted`函数来代替 例如，如果要在组件挂载之前执行某些逻辑，可以使用`onBeforeMount`函数，例如： ```vue <template> <div>{{ message }}</div> </template> <script setup> import { ref, onBeforeMount } from 'vue' const message = ref('Hello, world!') onBeforeMount(() => { console.log('组件即将挂载') }) </script> ``` 这样，在组件挂载之前会输出一条日志。 当然，在Vue 3.0中还有其他的API可以用来实现更精细化的控制，例如`onActivated`、`onDeactivated`、`onErrorCaptured`等等。具体可以参考官方文档。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值