bicontainer3 是一个基于 Vue 3 + TypeScript + Vite 的用来开发，适用于Vue 3 的 BI 大屏的组件库。
\r\n\r\n---\r\n\r\n\r\n## 用法\r\n\r\n### \r\n\r\n- 组件样式尺寸单位为 **px** ，原则上不允许使用其他尺寸单位，因为会影响缩放，特殊情况请慎重考虑与充分测试。\r\n\r\n### 安装\r\n\r\n```\r\nnpm install @biscreen/bicontainer3\r\n```\r\n\r\n### 全局使用：\r\n\r\nmain.ts\r\n\r\n```\r\n\r\nimport { createApp } from 'vue';\r\n\r\n// 引入\r\nimport BiContainer3 from '@biscreen/bicontainer3';\r\nimport '@biscreen/bicontainer3/dist/style.css';\r\n\r\nimport App from '@/App.vue';\r\nconst app = createApp(App);\r\n\r\n// 注册\r\napp.use(BiContainer3);\r\napp.mount('#app');\r\n\r\n```\r\n\r\n### 局部使用\r\n\r\n```\r\nimport '@biscreen/bicontainer3/dist/style.css';\r\nimport { BiContainer } from '@biscreen/bicontainer3';\r\n\r\n```\r\n\r\n## 组件 API\r\n\r\n- [BiContainer](#BiContainer)\r\n- [BiScrollView](#BiScrollView)\r\n\r\n### BiContainer\r\n\r\nBiContainer 是大屏容器，通过简单配置来渲染页面，开发者不必去关心屏幕适配的实现等问题。\r\n\r\n#### 属性\r\n\r\n| 属性 | 说明 | 是否必填 | 类型 | 可选值 | 默认值 |\r\n| ---------------- | ------------------------------------------------------- | -------- | -------- | ------------------------ | --------------- |\r\n| minSize | 允许缩放的最小尺寸 | 是 | string[] | -- | ['683', '384'] |\r\n| designSize | UI 设计尺寸。设置后可以直接使用设计上的其他视图组件尺寸 | 是 | string[] | -- | ['1366', '768'] |\r\n| customStyle | 容器自定义样式(样式层叠) | 否 | string | -- | -- |\r\n| v-model:openFull | 是否全屏,可以用来控制是否全屏 | 否 | boolean | -- | false |\r\n| fillMode | 填充模式 | 否 | string | 'contain' , 'stretching' | 'contain' |\r\n\r\n\r\n\r\n\r\n### BiScrollView\r\n\r\n| 属性 | 说明 | 是否必填 | 类型 | 可选值 | 默认值 |\r\n| ------------- | ---------------- | -------- | -------------- | ------ | -------- |\r\n| cellHeight | 单行行高 | n | number | -- | 60(px) |\r\n| height | 组件高度 | n | number | -- | 310(px) |\r\n| step | 一次滚动行数 | n | number | -- | 1 |\r\n| waitTime | 延迟多长时间开始 | n | number | -- | 1000(ms) |\r\n| duration | 动画时长 | n | number | -- | 1000(ms) |\r\n| stopAnimation | 是否停止 | n | boolean | -- | false |\r\n| list | 列表数据 | y | PropListItem[] | -- | [] |\r\n\r\n#### 类\r\n\r\nPropListItem\r\n\r\n```\r\nexport type PropListItem = {\r\n content: string;\r\n};\r\n```\r\n\r\n#### 插槽\r\n\r\n| 名字 | 说明 |\r\n| ------ | ---------------- |\r\n| -- | 列表 |\r\n| nodata | 无数据时候的内容 |\r\n\r\n","readmeFilename":"README.md"}