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 相关文章推荐
JS实多级联动下拉菜单类,简单实现省市区联动菜单!
May 03 Javascript
js限制文本框的输入内容代码分享(3类)
Aug 20 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
Oct 29 Javascript
jQuery表格插件datatables用法详解
Nov 23 Javascript
基于javascript简单实现对身份证校验
Jan 25 Javascript
javascript实现列表切换效果
May 02 Javascript
jquery延迟对象解析
Oct 26 Javascript
原生JS和jQuery操作DOM对比总结
Jan 19 Javascript
vue实现添加与删除图书功能
Oct 07 Javascript
vue-router路由模式详解(小结)
Aug 26 Javascript
使用Taro实现小程序商城的购物车功能模块的实例代码
Jun 05 Javascript
Vue.js暴露方法给WebView的使用操作
Sep 07 Javascript
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
一个简单的域名注册情况查询程序
2006/10/09 PHP
编译php 5.2.14+fpm+memcached(具体操作详解)
2013/06/18 PHP
PHP防止刷新重复提交页面的示例代码
2015/11/11 PHP
Thinkphp自定义代码生成工具及用法说明(附下载地址)
2016/05/27 PHP
PHP单例模式详解及实例代码
2016/12/21 PHP
PHP使用GD库制作验证码的方法(点击验证码或看不清会刷新验证码)
2017/08/15 PHP
PHP读取文件或采集时解决中文乱码
2021/03/09 PHP
javascript 另一种图片滚动切换效果思路
2012/04/20 Javascript
Javascript基础知识(三)BOM,DOM总结
2014/09/29 Javascript
使用AJAX实现Web页面进度条的实例分享
2016/05/06 Javascript
浅谈时钟的生成(js手写简洁代码)
2016/08/20 Javascript
BootStrap 获得轮播中的索引和当前活动的焦点对象
2017/05/11 Javascript
JS库之Particles.js中文开发手册及参数详解
2017/09/13 Javascript
node实现的爬虫功能示例
2018/05/04 Javascript
使用Node搭建reactSSR服务端渲染架构
2018/08/30 Javascript
layui switch 开关监听 弹出确定状态转换的例子
2019/09/21 Javascript
Python实现的用户登录系统功能示例
2018/02/05 Python
关于Python的一些学习总结
2018/05/25 Python
python判断计算机是否有网络连接的实例
2018/12/15 Python
pytorch 在网络中添加可训练参数,修改预训练权重文件的方法
2019/08/17 Python
tensorflow如何批量读取图片
2019/08/29 Python
Python3实现zip分卷压缩过程解析
2019/10/09 Python
python获取依赖包和安装依赖包教程
2020/02/13 Python
pytorch 计算ConvTranspose1d输出特征大小方式
2020/06/23 Python
html5自带表单验证体验优化及提示气泡修改功能
2017/09/12 HTML / CSS
菲律宾旅游网站:Expedia菲律宾
2017/10/11 全球购物
美国购买肉、鸭、家禽、鹅肝和熟食网站:D’Artagnan
2018/11/13 全球购物
彪马香港官方网上商店:PUMA香港
2020/12/06 全球购物
可口可乐广告词
2014/03/20 职场文书
银行柜员与客户起冲突检讨书
2014/09/27 职场文书
大学生违纪检讨书300字
2014/10/25 职场文书
金融专业银行实习证明模板
2014/11/28 职场文书
大学生创业事迹材料
2014/12/30 职场文书
PostgreSQL 插入INSERT、删除DELETE、更新UPDATE、事务transaction
2022/04/12 PostgreSQL
基于redis+lua进行限流的方法
2022/07/23 Redis
vue3 自定义图片放大器效果的示例代码
2022/07/23 Vue.js