vue组件暴露和.js文件暴露接口操作


Posted in Javascript onAugust 11, 2020

1、将同一类型的组件放在一个文件夹下

2、在此文件夹下创建一个index.js

vue组件暴露和.js文件暴露接口操作

3、在index.js中导入组件,并把他们暴露出去

1、写法一

import studentCourse1 from './studentCourse.vue'
 import studentInfo1 from './studentInfo.vue'
 
 export var studentCourse=studentCourse1
 export var studentInfo=studentInfo1

2、写法二

export var studentCourse=()=>import('./studentCourse.vue')
 export var studentInfo=()=>import('./studentInfo.vue')
 //export var studentInfo=()=>{
 return import('./studentInfo.vue')
 }

4、最后在.vue文件中使用组件

此处你只需引入index.js所在文件夹就行啦

import {studentCourse,studentInfo} from './components/stuCom'
 export default{
 components:{
  'StudentCourse':studentCourse,
  'StudentInfo':studentInfo
  }
 }

1、将.js放在同一个文件夹下

2、同样一定要有一个index.js文件

vue组件暴露和.js文件暴露接口操作

3、 index.js文件内容如下

import auth from './auth.js'
  import error from './error-log.js'
 export default{
 auth,
 error
 }

4、在main.js中

import utils from './utils'

Vue.use(utils.auth,{params})

补充知识:vue项目中将方法名暴露给APP端调用

只需要将methods中的方法赋值到window对象即可

created() {
 window.getParams = this.getParams
},
 
methods: {
 getParams(params) {
  this.id = params.id
  // ...
 },
}

也可以赋值给window对象中的某个对象

以上这篇vue组件暴露和.js文件暴露接口操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery ajax 检测用户注册时用户名是否存在
Nov 03 Javascript
时间戳转换为时间 年月日时间的JS函数
Aug 19 Javascript
jQuery事件用法实例汇总
Aug 29 Javascript
JS限制文本框只能输入数字和字母方法
Feb 28 Javascript
jquery trigger实现联动的方法
Feb 29 Javascript
Angular动态添加、删除输入框并计算值实例代码
Mar 29 Javascript
vue.js响应式原理解析与实现
Jun 22 Javascript
每天学点Vue源码之vm.$mount挂载函数
Mar 11 Javascript
bootstrap table.js动态填充单元格数据的多种方法
Jul 18 Javascript
微信小程序里引入SVG矢量图标的方法
Sep 20 Javascript
使用JS实现动态时钟
Mar 12 Javascript
Vue 组件注册全解析
Dec 17 Vue.js
vue npm install 安装某个指定的版本操作
Aug 11 #Javascript
小程序自动化测试的示例代码
Aug 11 #Javascript
vue自定义组件(通过Vue.use()来使用)即install的用法说明
Aug 11 #Javascript
Vue 实现创建全局组件,并且使用Vue.use() 载入方式
Aug 11 #Javascript
Vue自定义全局弹窗组件操作
Aug 11 #Javascript
基于Vue全局组件与局部组件的区别说明
Aug 11 #Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
Aug 11 #Javascript
You might like
写出高质量的PHP程序
2012/02/04 PHP
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
PHP常用的文件操作函数经典收藏
2013/04/02 PHP
php比较两个绝对时间的大小
2014/01/31 PHP
浅谈php提交form表单
2015/07/01 PHP
JavaScript中URL编码函数代码
2011/01/11 Javascript
JS 精确统计网站访问量的实例代码
2013/07/05 Javascript
javascript内置对象arguments详解
2014/03/16 Javascript
JavaScript设计模式之单件模式介绍
2014/12/28 Javascript
jQuery中parent()方法用法实例
2015/01/07 Javascript
AngularJS基础知识笔记之表格
2015/05/10 Javascript
jquery转盘抽奖功能实现
2015/11/13 Javascript
你不知道的 javascript【推荐】
2017/01/08 Javascript
jQuery Jsonp跨域模拟搜索引擎
2017/06/17 jQuery
nodejs实现截取上传视频中一帧作为预览图片
2017/12/10 NodeJs
微信小程序开发之自定义tabBar的实现
2018/09/06 Javascript
微信小程序下拉菜单效果的实例代码
2019/05/14 Javascript
rabbitmq(中间消息代理)在python中的使用详解
2017/12/14 Python
python之super的使用小结
2018/08/13 Python
python3调用百度翻译API实现实时翻译
2018/08/16 Python
Python AutoCAD 系统设置的实现方法
2020/04/01 Python
Python  word实现读取及导出代码解析
2020/07/09 Python
python 绘制正态曲线的示例
2020/09/24 Python
python打包生成so文件的实现
2020/10/30 Python
英国网上自行车商店:Tredz Bikes
2019/10/29 全球购物
亚洲领先的旅游体验市场:Voyagin
2019/11/23 全球购物
C#软件工程师英语面试题
2015/06/07 面试题
餐厅总经理岗位职责
2013/12/31 职场文书
查环查孕证明
2014/01/10 职场文书
2014年五一活动策划方案
2014/03/15 职场文书
沙滩主题婚礼活动策划方案
2014/09/15 职场文书
三提三创主题教育活动查摆整改措施
2014/10/25 职场文书
护士自荐信范文
2015/03/25 职场文书
终止解除劳动合同证明书
2015/06/17 职场文书
redis requires ruby version2.2.2的解决方案
2021/07/15 Redis
通过Python把学姐照片做成拼图游戏
2022/02/15 Python