中 封装使用自己的js方法

23 篇文章 6 订阅
13 篇文章 0 订阅

vue中使用自己的js方法

不废话直接上过程

一、src下新建utils(自己命名)文件夹,新建index.js(自己命名)文件

在这里插入图片描述

二、index.js(推荐三种写法)

 1. 第一种写法
	export default {
		aaa(){
			return alert('aaa')
		},
		bbb(){
			return alert('bbb')
		}
	}

 2. 第二种写法
	function aaa() {
	   return alert('aaa')
	}
	function bbb() {
	    return alert('bbb')
	}
	export default {
	    aaa,
	    bbb
	}
	

 3. 第三种写法
    const utils = {
	  aaa() {
	    return alert('aaa')
	  },
	  bbb() {
	   return alert('bbb')
	  }
	}
	export default utils

其实都一样,就是导出一个js文件,看个人习惯

三、挂载

//全局挂载 main.js(推荐,省事)
import utils from './utils/index';
Vue.prototype.$utils = utils;

单个组件挂载 test.vue
import { utils }   from "../utils/index.js";

四、使用

 //全局挂载的使用
 this.$utils.aaa();
 
 //单个组件使用
 this.utils.aaa() 

笔记:

后面会给出日常开发常用的一些方法

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值