zoukankan      html  css  js  c++  java
  • "时间范围"组件:<time-range> —— 快应用组件库H-UI

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                 <time-range id="timerange1" params="{{params}}"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange2" params="{{params}}" form-horizontal="true"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange3" params="{{params}}" form-horizontal="true" no-icon="true"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange4" params="{{params}}" form-horizontal="true" no-border="true"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange5" params="{{params}}" title="none"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange6" params="{{params}}" title="测试时间"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange7" params="{{params}}" form-horizontal="true" align-right="true"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange8" params="{{params}}" value="09:15至10:20"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange9" params="{{params}}" not-blank="false"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange10" params="{{params}}" valid="has-error" form-error="非法值!"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange11" params="{{params}}" disabled="true"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange12" params="{{params}}" valid="none" not-blank="false"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    <script>
        export default {
            private: {
                params: {}
            }
        }
    </script>
    

    <import name="form" src="../Common/ui/h-ui/form/c_form"></import>
    <import name="time-range" src="../Common/ui/h-ui/form/c_time_range"></import>
    <template>
        <div class="container">
            <form>
                <time-range id="timerange13" params="{{params}}" form-horizontal="true"></time-range>
            </form>
        </div>
    </template>
    
    <style lang="less">
        @import '../Common/styles/container.less';
    </style>
    
    
    <script>
        import prompt from '@system.prompt'
    
        export default {
            private: {
                params: {}
            },
            onInit() {
                this.$on('timerange13_dispatchEvt',this.dispatchEvt)
            },
            dispatchEvt(evt) {
                // 弹窗显示详细说明
                prompt.showToast({
                    message: evt.detail.value,
                    duration: 1,
                    gravity: 'top'
                })
            }
        }
    </script>
    

    扫码体验

  • 相关阅读:
    解决:微信小程序富文本识别不了空白p标签的方法
    微信小程序
    fastadmin
    微信小程序
    fastadmin使用笔记
    fastadmin使用笔记
    您有新的订单,请注意查收 提示音
    js获取视频第一帧生成图片
    解决JQ WeUI 的 Picker无法动态传值的问题
    微擎 人人商城小程序获取不到用户信息
  • 原文地址:https://www.cnblogs.com/cloud-dev/p/shi-jian-fan-weizu-jianlttimerangegt--kuai-ying-yo.html
Copyright © 2011-2022 走看看