vue-cron-picker v1.0.4

依赖

Element ui 2.x ElementUI相关组件,css文件

VUE 2.x

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

安装

# 安装组件
npm install vue-cron-picker --save

引入

//全局引入
import Vue from 'vue'
import VueCronPicker from 'vue-cron-picker';
 
Vue.use(VueCronPicker);
 
//局部引入
import {vueCronPicker} from 'vue-cron-picker'
 
export default {
    template: '<vueCronPicker/>',
    components: { vueCronPicker }
}

使用

<template>
    <div class="cron">
        <h1>vue-cron-picker</h1>
        <el-popover v-model="openCron" placement="top">
            <el-input slot="reference" @click="cronPopover=true" 
                v-model="form.cron" placeholder="请输入定时策略" 
                >
            </el-input>
            <vue-cron-picker @hide="openCron=false" @fill="crontabFill" :expression="expression"></vue-cron-picker>
        </el-popover>
    </div>
</template>
<script>
    //局部引入
    import {vueCronPicker} from 'vue-cron-picker';
 
    export default {
        components: { vueCronPicker },
        data(){
            return {
                openCron:false,
                expression:'',
                form:{
                    cron:""
                },
                cronPopover:false
            }
        },
        methods: {
            crontabFill(val){
                this.form.cron=val
            },
        },
    }
</script>

联系方式

邮箱:2511963350@qq.com 有任何问题可发邮件联系我!