怎么使用全局函数

首先在main.js中挂载一个全局函数

//static全局属性
//getStaticFilePath把这个方法挂载到vue的原型对象上，这个方法就叫全局函数，每个组件都可以使用了
//url是从组件传过来的参数
Vue.prototype.getStaticFilePath=function(url){
	return url
}

 然后在组件中写一个img标签，并使用全局函数渲染图片

//把图片路径当成参数传到了main.js里的全局函数里
// getStaticFilePath（）就是全局函数
<img :src="getStaticFilePath('https://img0.baidu.com/it/u=2371305810,3587591415&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=281')" alt="">

 完成！

实际开发应用：

一般我们都会把静态图片资源通过图传的形式上传到服务器上

/--main.js文件--/

//static全局属性
Vue.prototype.staticDir='../static';
//通过图传的形式把图片上传到服务器上，然后设置的图片根路径（图传这一步是后端做的，这个图传是用的七牛云）
Vue.prototype.staticDir='https://qiniu.chinardr.net/v2/img/';  //这个链接就是图片的根路径
Vue.prototype.getStaticFilePath=function(url){   //url是图传处理过的图片名称
	return Vue.prototype.staticDir + url           //图片跟路径和url图片名称拼接
}


Vue.prototype.staticDir1='https://static-492a7608-6a54-41ae-8b7a-717f67565d69.bspapp.com/static/icon/';
Vue.prototype.getStaticIconPath=function(url){
	return Vue.prototype.staticDir1 + url
}

<image @click="run()"
	:src="[status?getStaticFilePath('b2tArrow.png'):getStaticFilePath('t2bArrow.png')]"mode="aspectFit">
</image>