css文件
在main.js中导入公共的css
import '../static/css/common.css' //引入公用css
在页面中引入单独css
<style scoped>
@import '../../static/css/header.css'
</style>
Js文件
自定义js 中写:
function title(t){
alert(t)
}
export {
title //多个方法在此处json中export出去
}
页面中使用:
<template>
<div>
<button class="btn" @click="clickme">click me</button>
</div>
</template>
<script>
import {title} from './js/common.js' //可以选择需要的方法引入
export default {
data(){
return{
}
},
methods:{
clickme(){
title('你点我了')
}
}
}
</script>
或者
import Comjs from './js/common.js' //引入公用js
Vue.prototype.$comjs = Comjs//添加到vue属性中
自定义js 中写:
const comjs = {
}
comjs.title = function (title) {
alert(title)
}
export default comjs
页面中使用:
<template>
<div>
<button class="btn" @click="clickme">click me</button>
</div>
</template>
<script>
export default {
data(){
return{
}
},
methods:{
clickme(){
this.$comjs.title('你点我了')
}
}
}
</script>
我们在HTML中经常需要引入CSS和JS文件,那么如何引入呢?下面我给大家演示一下。
工具/材料Sublime Text
01首先新建一个文件夹,在文件夹下面建立如下图所示的文件
02接下来用Sublime Text打开HTML文件,写入HTML结构,如下图所示
03然后我们在Head标签内用link标签引入CSS文件,如下图所示
04最后用Script标签引入JS文件即可,如下图所示