vue中export和export default的使用

news2025/1/3 11:43:18
<script>
export default {
  name: 'HelloWorld'
}
$(function () {
  alert('引入成功')
})
</script>

1、export的使用

比喻index.js要使用test.js中的数据,首先在test.js文件中进行导出操作

代码如下:

export function list()
{
    alert("list");
}

export function info()
{
    alert("info");
}

export  let a=10;

 在index.js文件进行导入操作

 代码如下:

<template>
  <div>
    <div v-show="show">HelloWorld</div>
    <button @click="handleClick">Click</button>
  </div>
</template>

<script>

import {list} from '@/components/common.js'

export default {
  name: "test",
  data() {
    return {
      show: true
    };
  },
  methods: {
    handleClick: function() {
      list();
    }
  }
};
</script>

2、export default的使用

test.js文件

 index.js文件中:

 注意:

一个js文件是可以有多个 export

但是一个js文件中只能有一个export default

我们找到在vue的学习和使用中经常会看到这样的一个符号$(美元符号),那么很多人就可能产生了疑惑,这个符号有什么作用呢,其实也不难理解,这个是为了区分vue中的自带的实例和用户自定义的属性而已

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/781799.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

EasyExcel写出包含多个sheet页的Excel

EasyExcel导出包含多个sheet页的Excel 1.引入依赖 引入如下的EasyExcel的依赖&#xff0c;或直接下载jar包 <dependency><groupId>com.alibaba</groupId><artifactId>easyexcel</artifactId><version>3.1.1</version></depende…

文心千帆大模型平台,一站式企业级大模型平台

文心千帆大模型平台&#xff0c;一站式企业级大模型平台 0. 前言1. 人工智能发展历程1.1 传统机器学习1.2 深度学习1.3 大模型时代 2. 文心千帆2.1 文心千帆介绍2.2 文心千帆应用场景2.3 文心千帆平台优势 3. 文心千帆初体验3.1 注册流程3.2 创建应用3.3 在线测试3.4 数据服务3…

玩转ChatGPT:Custom instructions (vol. 1)

一、写在前面 据说GPT-4又被削了&#xff0c;前几天让TA改代码&#xff0c;来来回回好几次才成功。 可以看到之前3小时25条的限制&#xff0c;现在改成了3小时50条&#xff0c;可不可以理解为&#xff1a;以前一个指令能完成的任务&#xff0c;现在得两条指令&#xff1f; 可…

如何将windows下的应用程序直接放到ubuntu下运行

安装wine https://blog.csdn.net/gc_2299/article/details/129077372 安装.NET https://dotnet.microsoft.com/en-us/download/dotnet-framework/net472

Vue中的props配置

结构&#xff1a; main.js //引入Vue import Vue from vue //引入App import App from "./App"; //关闭Vue的生产提示 Vue.config.productionTip false//创建vm new Vue({el:#app,render:h>h(App) }) App.vue <template><div><Student name&qu…

运行Yolov5 7.0遇到的问题

遇到的错误 Traceback (most recent call last):File "E:\Users\user\anaconda3\envs\torch17\lib\site-packages\git\__init__.py", line 89, in <module>refresh()File "E:\Users\user\anaconda3\envs\torch17\lib\site-packages\git\__init__.py"…

RocketMQ Windows环境下启动导致C盘爆满原因及解决办法

原因 rocketmq取的默认路径是user.home路径&#xff0c;也就是用户的根目录&#xff0c;一般存储放在跟路径下的 /store目录。 在源码中也可以看到&#xff1a; 这里会有一个问题&#xff0c;RocketMQ很容易导致C盘空间不够&#xff0c;在使用过程中&#xff0c;创建一个主题默…

二,jmeter的简介和使用

文章目录 一、jmeter简介及安装1. 简介2. 安装 二、jmeter设置语言三、jmeter文件路径说明四、编写jmeter脚本五、乱码的处理&#xff1a;1. 请求内容出现乱码处理方法2. 响应内容出现乱码处理方法 六、写脚本方法扩展录制脚本&#xff1a; 七、 脚本功能增强 一、jmeter简介及…

pytorch学习——第二个模型(逻辑回归)

参考该博客系统学习Pytorch笔记二&#xff1a;Pytorch的动态图、自动求导及逻辑回归 c l a s s { 0 0.5 > y 1 0.5 ≤ y class\left\{ \begin{array}{rcl} 0 & & {0.5 > y}\\ 1 & & {0.5 \le y}\\ \end{array} \right. class{01​​0.5>y0.5≤y​ 根…

图数据库Neo4j学习一——基本介绍

文章目录 1各类数据库基本概念1.1关系型数据库&#xff08;SQL&#xff09;1.2非关系型数据库&#xff08;NoSQL&#xff09;1.3图数据库1.3.1图数据库特点1.3.2图数据库应用场景 2图数据库基本概念2.1用户访问菜单2.2节点&#xff08;用户、角色、菜单&#xff09;2.3关系&…

动态规划:从入门到入土系列(一)

&#x1f388;个人主页:&#x1f388; :✨✨✨初阶牛✨✨✨ &#x1f43b;推荐专栏1: &#x1f354;&#x1f35f;&#x1f32f;C语言初阶 &#x1f43b;推荐专栏2: &#x1f354;&#x1f35f;&#x1f32f;C语言进阶 &#x1f511;个人信条: &#x1f335;知行合一 前言 本篇…

高级web前端开发工程师岗位的具体内容概述

高级web前端开发工程师岗位的具体内容概述1 职责&#xff1a; 1、负责前端页面开发和维护&#xff0c;并根据需求优化产品性能、用户体验、交互效果及各种主流浏览器以及各类型移动客户端的兼容适配工作; 2、配合产品经理和UI设计师&#xff0c;通过各种前端技术手段&#xf…

[MySQL]MySQL用户管理

[MySQL]MySQL用户管理 文章目录 [MySQL]MySQL用户管理1. 用户的概念2. 用户信息3. 创建用户4. 修改用户密码5. 删除用户6. MySQL中的权限7. 给用户授权8. 回收权限 1. 用户的概念 MySQL中的用户分为超级用户&#xff08;root&#xff09;和普通用户。超级用户的操作是不受权限…

IDEA对JPA@Query查询的文本块支持

IDEA对JPAQuery查询的文本块支持 参考网址 JPA查询方式&#xff1a;方法命名规则、Query查询、结果集类型转化器 原先JPA的Query注解查询存在的问题 编写SQL时需要在value的""内&#xff0c;使用换行时会拼接字符串&#xff0c;观感极差如果SQL中使用到了单引号&…

第三十二章:MySQL事务日志

第三十二章&#xff1a;MySQL事务日志 32.1&#xff1a;概述 事物有4种特性&#xff1a;原子性、一致性、隔离性和持久性。那么事务的四种特性到底是基于什么机制实现呢&#xff1f; 事物的隔离性有锁机制实现。而事物的原子性、一致性和持久性由事物的redo日志和undo日志来…

基于深度学习淡水鱼体重智能识别模型研究

工作原理为&#xff1a;首先对大众淡水鱼图片进行数据清洗并做标签分类&#xff0c;之后基于残差网络ResNet50模型进行有监督的分类识别训练&#xff0c;获取识别模型。其次通过搭建回归模型设计出体重模型&#xff0c;对每一类淡水鱼分别拟合出对应的回归方程&#xff0c;将获…

【基础算法】——双指针算法

文章目录 一、算法原理二、算法实战1. 力扣283 移动零2. 力扣1089 复写零3. 力扣15 三数之和4. 力扣18 四数之和 三、总结 一、算法原理 双指针算法是指在遍历对象的过程中不是普通的使用单个指针进行访问&#xff0c;而是使用两个相同方向(快慢指针)或者相反方向&#xff08;…

机器学习实战11-基于K-means算法的文本聚类分析,生成文本聚类后的文件

大家好&#xff0c;我是微学AI&#xff0c;今天给大家介绍机器学习实战11-基于K-means算法的文本聚类分析&#xff0c;生成文本聚类后的文件。文本聚类分析是NLP领域的一个核心任务&#xff0c;通过将相似的文本样本分组&#xff0c;可以帮助我们发现隐藏在文本数据中的模式和结…

Docker概述 镜像-容器基本操作

Docker 概述 Docker是一个开源的应用容器引擎&#xff0c;基于go语言开发并遵循了apache2.0协议开源。 Docker是在Linux容器里运行应用的开源工具&#xff0c;是一种轻量级的“虚拟机”。 Docker 的容器技术可以在一台主机上轻松为任何应用创建一个轻量级的、可移植的、自给自足…

Redis应用(7)——Redis的项目应用(六):布隆过滤器---白名单 ----> Reids的问题,雪崩/ 击穿 / 穿透【重要】 布隆过滤器

目录 引出Redis的问题缓存雪崩&#xff1a;key不存在缓存击穿&#xff1a;热点key缓存穿透【重要】 穿透的解决方案&#xff1a;布隆过滤器问题&#xff1a;如何存储100w纯数字布隆过滤器项目应用&#xff1a;布隆过滤器≈白名单htool工具包案例 Redis项目应用&#xff08;六&a…