当前位置： 移动技术网 > IT编程>移动开发>Android > "插入日历"组件:<calendar> —— 快应用组件库H-UI

"插入日历"组件:<calendar> —— 快应用组件库H-UI

2020年04月17日  | 移动技术网IT编程  | 我要评论

前泥洼拆迁,老师的恩惠剧情,堕落警察txt


用户第一次插入日历，需要授权确认：

日历插入成功或失败，会在快应用顶部做全局提示：

查看系统日历：




<import name="calendar" src="../common/ui/h-ui/advance/c_calendar"></import>
<template>
    <div class="container-full">
        <calendar data="{{data}}" params="{{params1}}"></calendar>
    </div>
</template>

<style lang="less">
    @import '../common/styles/container.less';
</style>

<script>
    export default {
        private: {
            data: {},
            params1: {}
        }
    }
</script>



插入日历后查看手机系统日历，结果一致：



<import name="calendar" src="../common/ui/h-ui/advance/c_calendar"></import>
<template>
    <div class="container-full">
        <calendar data="{{data2}}" params="{{params2}}"></calendar>
    </div>
</template>

<style lang="less">
    @import '../common/styles/container.less';
</style>

<script>
    export default {
        private: {
            data2:{
                'title': '我的健身日程',
                'content': '参加李教练的健身课。',
                'date': '2020-03-31',
                'timerange': '15:30至16:30',
                'allday': false,
                'remind': ['5','10','30'],//支持：1，5，10，15，30，60，120
                //'repeat': 'weekly',//支持：daily，weekly，monthly，yearly
                'repeat': 'weekly',
                'expiration': 'until',//支持：forever，count,until
                //'count': '10',
                'until': '2021-03-31',
                'interval': '1',
                'byday': ['tu','th']
            },
            params2: {}
        }
    }
</script>



<import name="calendar" src="../common/ui/h-ui/advance/c_calendar"></import>
<template>
    <div class="container-full">
        <calendar data="{{data}}" params="{{params3}}" type="danger"></calendar>
    </div>
</template>

<style lang="less">
    @import '../common/styles/container.less';
</style>

<script>
    export default {
        private: {
            data: {},
            params3: {}
        }
    }
</script>



<import name="calendar" src="../common/ui/h-ui/advance/c_calendar"></import>
<template>
    <div class="container-full">
        <calendar data="{{data}}" params="{{params4}}" simple="true"></calendar>
    </div>
</template>

<style lang="less">
    @import '../common/styles/container.less';
</style>

<script>
    export default {
        private: {
            data: {},
            params4: {}
        }
    }
</script>

扫码体验



您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网