vue外掛

西安小哥發表於2019-02-16
Vue

  • 1、編寫vue元件myUploader.js

<template>
    <label :for="dataId" :style="dataStyle" class="upLoaderFile" :class="dataClass">
        <input type="file" class="dishidden fileSelectUpButton" name="file" :id="dataId">
        <slot name="textWord" class="textWord"></slot>
    </label>
</template>
<script>
var fileUpLoader = require(`../../libs/uploadFile/js/jquery.fileupload.js`); //上傳圖片
export default {
    name: "myUpLoad",
}

  • 2、編寫vue元件myUploader，在index.js中匯入進來(test.js)

import myUploader from "./myUploader ";
var install = function(Vue, options) {
    if (install.installed) return;
    debugger
    Vue.component(myUploader.name, myUploader );
}
export default install;//返回install物件
//module.exports = {install};或者這種方式匯入

  • 3、在main.js中引入(main.js)

import myUploader from "./test.js";
Vue.use(myUploader );

  • 4、頁面上引入

不用匯入，可以直接在想用的地方使用

<my-upLoad></my-upLoad>

相關文章