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 相关文章推荐
javascript判断非数字的简单例子
Jul 18 Javascript
深入理解JavaScript编程中的同步与异步机制
Jun 24 Javascript
Bootstrap CSS布局之表单
Dec 17 Javascript
使用vue制作FullPage页面滚动效果
Aug 21 Javascript
详解React Native开源时间日期选择器组件(react-native-datetime)
Sep 13 Javascript
js和jQuery以及easyui实现对下拉框的指定赋值方法
Jan 23 jQuery
angular5 httpclient的示例实战
Mar 12 Javascript
解决vuecli3.0热更新失效的问题
Sep 19 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
Apr 11 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
Jul 09 Javascript
微信小程序实现锚点跳转
Nov 23 Javascript
vue使用v-model进行跨组件绑定的基本实现方法
Apr 28 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
escape unescape的php下的实现方法
2007/04/27 PHP
PHP 冒泡排序算法的实现代码
2010/08/08 PHP
PHP 实现类似js中alert() 提示框
2015/03/18 PHP
php递归删除指定文件夹的方法小结
2015/04/20 PHP
php 使用fopen函数创建、打开文件详解及实例代码
2016/09/24 PHP
PHP如何通过表单直接提交大文件详解
2019/01/08 PHP
jquery each()源代码
2011/02/14 Javascript
js的Prototype属性解释及常用方法
2014/05/08 Javascript
js的image onload事件使用遇到的问题
2014/07/15 Javascript
jQuery检测某个元素是否存在代码分享
2015/07/09 Javascript
jQuery实现可展开折叠的导航效果示例
2016/09/12 Javascript
详解Vue2.0里过滤器容易踩到的坑
2017/06/01 Javascript
IntersectionObserver实现图片懒加载的示例
2017/09/29 Javascript
微信小程序引入VANT组件的方法步骤
2019/09/19 Javascript
基于canvasJS在PHP中制作动态图表
2020/05/30 Javascript
解决python中使用plot画图,图不显示的问题
2018/07/04 Python
Python实现压缩文件夹与解压缩zip文件的方法
2018/09/01 Python
pandas筛选某列出现编码错误的解决方法
2018/11/07 Python
解决Python print输出不换行没空格的问题
2018/11/14 Python
Python寻找路径和查找文件路径的示例
2019/07/10 Python
pytorch使用 to 进行类型转换方式
2020/01/08 Python
美国药妆网站:EDCskincare.com(防晒、痤疮、抗衰老等)
2017/04/28 全球购物
新加坡最佳婴儿用品店:Mamahood.com.sg
2018/08/26 全球购物
元宵节主持词
2014/03/25 职场文书
关于祖国的演讲稿
2014/05/04 职场文书
文艺演出策划方案
2014/06/07 职场文书
新颖的化妆品活动方案
2014/08/21 职场文书
党性锻炼的心得体会
2014/09/03 职场文书
关于成绩下滑的自我检讨书
2014/09/20 职场文书
2014光棍节大学生联谊活动方案
2014/10/10 职场文书
2015年小学开学寄语
2015/02/27 职场文书
2015年车间安全管理工作总结
2015/05/13 职场文书
2015年中职班主任工作总结
2015/05/25 职场文书
四大名著读书笔记
2015/06/25 职场文书
导游词之河北邯郸
2019/09/12 职场文书
聊聊golang中多个defer的执行顺序
2021/05/08 Golang