tnuiv3p-tn-privacy-popup-box

1.0.1 • Public • Published

图鸟 UI vue3 uniapp Plugins - 隐私弹框

TuniaoUI vue3 uniapp

Tuniao UI vue3官方仓库

该组件一般用于让用户确认隐私协议

组件安装

npm i tnuiv3p-tn-privacy-popup-box

组件位置

tnuiv3p-tn-privacy-popup-box/index.vue

平台差异说明

App(vue) H5 微信小程序 支付宝小程序 ...
适配中

基础使用

  • 通过v-model控制隐私弹框的显示与隐藏
<script setup lang="ts">
import { ref } from 'vue'

const showPrivacyPopup = ref(false)
</script>

<template>
  <TnPrivacyPopupBox v-model="showPrivacyPopup" />
</template>

修改隐私弹框弹出位置

  • 通过设置open-direction的值为centerbottom控制隐私弹框从中间弹出还是从底部弹出
<template>
  <TnPrivacyPopupBox v-model="showPrivacyPopup" open-direction="bottom" />
</template>

API

Props

属性名 说明 类型 默认值 可选值
v-model/model-value 控制隐私弹框的显示与隐藏 Boolean false true
open-direction 隐私弹框弹出的位置 String center bottom
title 隐私弹框标题 String 用户隐私保护提示 -
agree-text 同意隐私按钮文案 String 同意并继续 -
disagree-text 不同意隐私按钮文案 String 不同意 -
privacy-contract-text 隐私保护指引文案 String 《用户隐私保护指引》 -
agree-bg-color 同意按钮背景颜色,以tn开头使用图鸟内置颜色 String - -
agree-color 同意按钮字体颜色,以tn开头使用图鸟内置颜色 String - -
disagree-bg-color 不同意按钮背景颜色,以tn开头使用图鸟内置颜色 String - -
disagree-color 不同意按钮字体颜色,以tn开头使用图鸟内置颜色 String - -

Emits

事件名 说明 类型
close 弹框关闭事件 () => void
agree 点击同意按钮事件 () => void
disagree 点击不同意按钮事件 () => void
open-protocol 点击查看隐私协议事件 () => void
agree-privacy-authorization 同意隐私协议回调事件 () => void

Package Sidebar

Install

npm i tnuiv3p-tn-privacy-popup-box

Weekly Downloads

8

Version

1.0.1

License

Apache 2.0

Unpacked Size

22.1 kB

Total Files

15

Last publish

Collaborators

  • tuniao_technology