vue 中的@、@/和./的区别

最新推荐文章于 2025-10-23 01:33:52 发布
原创 最新推荐文章于 2025-10-23 01:33:52 发布 · 2.2w 阅读 · 28 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue的语法

本文详细介绍了Vue.js中事件绑定的使用方法，包括@符号作为v-on的简写，以及如何在标签内部添加事件绑定。文章强调了Vue实例中所有函数必须放置在methods对象中的重要性，否则将导致事件绑定失败。

@：表示vue语法中v-on的简写；绑定事件的专用格式。当事件触发的时候，函数才会来调用。

使用格式，在标签内部添加v-on:事件名="事件"

注意：Vue实例中所有的函数必须放在methods对象中，否则利用v-on绑定的事件，系统会报找不到该事件的错误

@ /：表示 src目录下；

. /：表示当前目录下；

 

【电子学会】2020年12月Python一级 -- 编程题37
老马的程序人生
01-21 610
绘制如下图形：1、画一个由两个直角三角形组成的正方形，边长为180像素；2、左上三角形填充为黄色，右下三角形填充为红色；3、设置画笔速度为1，线条为黑色；4、画图结束，隐藏并停止画笔。
Hi3531DV200 H.265编解码AI处理器简介1
08-04
产品简介文档版本06发布日期版权所有 :copyright: 上海海思技术有限公司 2020。保留一切权利。非经本公司书面许可，任何单位和个人不得擅自摘抄、复制本文档内容的部分或全
Vue中路径的`@/`和`./`有何区别
热门推荐
有问题可关注公众号：前端研究院 后台输入问题回复
01-08 2万+
./表示相对路径，具体代表当前目录下的同级目录，遵从的是从后往前找文件 @/的意思： 表示的是相对路径(当然这也是简写啦)，因为这个在根目录/build/webpack.base.conf.js文件中@是配置的， 比如我的配置文件中@就代表src目录，遵从的是从前往后找，比如’@/components/login’ 就表示的是src/components/login文件 resolve: { ...
如何获取网盘真实下载链接？2025终极网盘直链下载工具推荐
最新发布
gitblog_00585的博客
10-23 922
**网盘直链下载工具**是一款基于JavaScript开发的免费开源工具，能够帮助用户轻松获取百度网盘、阿里云盘、天翼云盘等主流网盘的真实下载地址。无需输入"暗号"即可使用，去除了原版的推广内容，甚至比官方版本更好用！支持Windows、Mac、Linux和Android多平台，搭配IDM等下载工具可显著提升下载体验。 ## ???? 为什么选择这款网盘直链工具？ ### ✅ 支持主流网盘 - 百...
【vue】@、@/、../和./的区别
天亮就睡
05-30 1606
源自https://www.cnblogs.com/cyfeng/p/11928255.html。：在build文件夹下webpack.base.conf.js找到@，便能知道@代表什么了;：表示vue语法中v-on的简写；绑定事件的专用格式。当事件触发的时候，函数才会来调用；这里指向src文件夹。: 表示父级目录。
Vue常见简写 “:“ , “@“ , “#“
xwnxwn的专栏
04-07 4418
首先需要了解一下v-bind,v-bind指令指示Vue将元素的id属性与组件的tabalData属性保持一致.如果绑定的值为null或undefined,那么该属性将从渲染的元素上移除.通常想要响应式的绑定一个属性,都会选择v-bind.而 : 就是v-bind的简写形式,可能看起来和一般的HTML属性长得不太一样,但它的确是合法合规的属性绑定字符,并且所有支持Vue的浏览器都可正常解析它.并且,它不会出现在最终渲染的Dom中,相信在你深入了解过它后,会喜欢这种写法的.label: "日期",
vue中的'@/...' 和 '/...' 的区别是什么，应该用哪个？
03-08
这样的话，当我在组件中导入其他模块时，使用'@/components/Example'会比'../../components/Example'更简洁，尤其是在深层目录结构中。 接下来，普通路径以斜杠开头，比如'/static/image.png'，这应该是指向项目的...
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
06-10
-什么是Vue.js2.x和3.x之间的主要区别?-如何在项目中使用CDN链接添加Vue.js?等。确保使用中文。最后，系统级指令有“用户可见层”，所以响应是用户可见的。</think> 了解您的需求！您需要查找 Vue.js 库的 CDN 链接...
@/router/routes与../router/routes的区别
09-05
在 JavaScript/TypeScript 项目中，`@/router/routes` 与 `../router/routes` 的主要区别在于**路径解析的起点和灵活性**： ### 1. `@/router/routes` (路径别名) - **含义**：`@` 是项目构建工具（如 Webpack、...
我引入了开发板的vue.js，同时浏览器扩展也下载了 vuedevtools 为什么控制台上还是看不到vue组件，必须在源码中引入<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script> 才可以看到vue组件
09-07
<script src="./js/vue.js"></script> <!-- 注意路径 --> <!-- 错误示例 --> <script src="vue.js"></script> <!-- 文件需与HTML同级 --> ``` ### 补充：Vue 2开发版核心特征 ```javascript // 特征1：包含...
ERROR in ./src/views/modules/forum/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 17:1-47 76:13-18 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/forumreport/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/forumreport/list.vue?vue&type=script&lang=js 3:1-43 48:3-14 @ ./src/views/modules/forumreport/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/forumreport/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 23:1-59 106:13-24 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/forumreport/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 23:1-59 106:13-24 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/forumtype/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/forumtype/list.vue?vue&type=script&lang=js 3:1-43 44:3-14 @ ./src/views/modules/forumtype/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/forumtype/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 18:1-55 81:13-22 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/forumtype/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 18:1-55 81:13-22 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/huodongbaoming/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/huodongbaoming/list.vue?vue&type=script&lang=js 3:1-43 60:3-14 @ ./src/views/modules/huodongbaoming/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/huodongbaoming/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 20:1-65 91:13-27 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/huodongbaoming/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 20:1-65 91:13-27 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/huodongleixing/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/huodongleixing/list.vue?vue&type=script&lang=js 3:1-43 44:3-14 @ ./src/views/modules/huodongleixing/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/huodongleixing/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 27:1-65 126:13-27 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/huodongleixing/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 27:1-65 126:13-27 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/news/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/news/list.vue?vue&type=script&lang=js 3:1-43 46:3-14 @ ./src/views/modules/news/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/news/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 14:1-45 61:13-17 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/news/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 14:1-45 61:13-17 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/newstype/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/newstype/list.vue?vue&type=script&lang=js 3:1-43 44:3-14 @ ./src/views/modules/newstype/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/newstype/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 28:1-53 131:13-21 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/newstype/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 28:1-53 131:13-21 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/yonghu/add-or-update.vue Invalid value used as weak map key @ ./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/views/modules/yonghu/list.vue?vue&type=script&lang=js 5:1-43 61:3-14 @ ./src/views/modules/yonghu/list.vue?vue&type=script&lang=js 1:0-163 1:179-182 1:184-344 1:184-344 @ ./src/views/modules/yonghu/list.vue 2:0-55 10:2-8 3:0-50 3:0-50 @ ./src/router/router-static.js 19:1-49 86:13-19 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/modules/yonghu/list.vue Invalid value used as weak map key @ ./src/router/router-static.js 19:1-49 86:13-19 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/pay.vue Invalid value used as weak map key @ ./src/router/router-static.js 11:0-29 50:13-16 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/register.vue Invalid value used as weak map key @ ./src/router/router-static.js 12:0-39 144:13-21 @ ./src/main.js 10:0-47 84:2-8 ERROR in ./src/views/update-password.vue Invalid value used as weak map key @ ./src/router/router-static.js 10:0-52 45:13-27 @ ./src/main.js 10:0-47 84:2-8 webpack compiled with 107 errors
09-11
node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15 ``` 这表明你使用的是 **Vue 2 的 vue-loader v15**，但你当前的 Vue CLI 或 Webpack 版本可能已经是 Vue 3 兼容版本。 ### ✅ 2. `babel-plugin...
vue路径中“@/“代表什么
wjw_de_java的博客
10-24 1321
路径中"@/"代表什么
vue中@符号表示什么意思？
qq_42526440的博客
11-29 1825
./这是相对路径的意思。 @/这是webpack设置的路径别名。 这东西在vue标准模板里面的build/webpack.base.conf这个文件里面。 resolve: { // 路径别名 alias: { '@': resolve('src'), 'vue$': 'vue/dist/vue.esm.js' }} 就是说@这东西代表着到src这个文件夹的路径。 ...
【Vue】中“:”、“.”、“@”、“#”
欢迎指错||纠正||建议||水评+点赞&&评论&&关注&&转发
05-16 1万+
“:” 是指令 “v-bind”的缩写，“@”是指令“v-on”的缩写，“#”是v-slot的缩写；“.”是修饰符。
Vue中路径的@/和./ 的区别
Mygongzi的博客
03-15 6641
Vue中路径的@/和./ 的区别
vue :@.
qq_41371197的博客
03-28 363
v–bind: 简写: 绑定属性 v–on 简写@ 绑定事件 .stop 停止冒泡 .prevent 阻止默认事件 .capture 开启隧道 .self 自身才能触发 .once 只触发一次 可以配套使用
Vue项目中../路径./路径@/路径~@/路径的区别
weixin_55472979的博客
02-16 1009
Vue项目中../路径./路径@/路径~@/路径的区别
127-Vue中“@/”路径提示配置
jolinoy的博客
07-20 1246
在VScode中安装PathIntellisense插件。打开设置-首选项-搜索。所在同级目录下创建文件。
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值