"广告组件"组件:<ad> —— 快应用组件库H-UI

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}" width="300" height="200"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container-full">
            <ad data="{{data}}" full-width="true" full-height="true"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}" indicator-selected-color="#ff0000"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}" autoplay="false"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}" loop="false"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}" vertical="true"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

<import name="ad" src="../Common/ui/h-ui/advance/c_ad"></import>
<template>
        <div class="container">
            <ad data="{{data}}" indicator="false"></ad>
        </div>
</template>

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

<script>
    export default {
        private: {
            data:
                [{
                    uri: "/About",
                    title: "广告一的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture2.png",
                    footword: "8图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告二的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture3.png",
                    footword: "3图",
                    footsource: "H-UI"
                },
                {
                    uri: "/About",
                    title: "广告三的标题",
                    pic: "https://h-ui.obs.cn-south-1.myhuaweicloud.com/image/picture4.png",
                    footword: "3图",
                    footsource: "H-UI"
                }]
        }
    }
</script>

扫码体验

相关阅读:
开启CTF大门
 关于windows下scapy出现log_runtime问题
 Python关于Threading暂停恢复解决办法
 angr入门之CLE
Linux信号量
 IDApython 命令
 Array 数组对象
 随机数 random()
四舍五入round()
向下取整floor()
原文地址：https://www.cnblogs.com/cloud-dev/p/guang-gao-zu-jianzu-jianltadgt--kuai-ying-yong-zu-.html