opentiny
/
tiny-vue
2
0
Fork 30
Code Issues Pull Requests 7 Packages Projects Releases Wiki Activity

feat(container): [container] Check and modify issues (#2349)

This commit is contained in:
东风使命必达 2024-10-22 00:00:29 -07:00 committed by GitHub
parent 5e19e9056b
commit c682b1c881
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
examples/sites/demos/pc/app/container/basic-usage-composition-api.vue
View File

@ -3,11 +3,11 @@
<div class="option-row">
<span class="tip">选择版型：</span>
<tiny-radio-group v-model="pattern">
<tiny-radio label="default">默认:default</tiny-radio>
<tiny-radio label="classic">经典:classic</tiny-radio>
<tiny-radio label="simple">简约:simple</tiny-radio>
<tiny-radio label="fashion">时尚:fashion</tiny-radio>
<tiny-radio label="legend">传奇:legend</tiny-radio>
<tiny-radio label="default">默认：default</tiny-radio>
<tiny-radio label="classic">经典：classic</tiny-radio>
<tiny-radio label="simple">简约：simple</tiny-radio>
<tiny-radio label="fashion">时尚：fashion</tiny-radio>
<tiny-radio label="legend">传奇：legend</tiny-radio>
</tiny-radio-group>
</div>
<tiny-container :pattern="pattern">
@ -27,7 +27,7 @@
<script setup lang="jsx">
import { ref } from 'vue'
import { Container as TinyContainer, Radio as TinyRadio, RadioGroup as TinyRadioGroup } from '@opentiny/vue'
import { TinyContainer, TinyRadio, TinyRadioGroup } from '@opentiny/vue'
const pattern = ref('default')
</script>

10
examples/sites/demos/pc/app/container/basic-usage.vue
View File

@ -3,11 +3,11 @@
<div class="option-row">
<span class="tip">选择版型：</span>
<tiny-radio-group v-model="pattern">
<tiny-radio label="default">默认:default</tiny-radio>
<tiny-radio label="classic">经典:classic</tiny-radio>
<tiny-radio label="simple">简约:simple</tiny-radio>
<tiny-radio label="fashion">时尚:fashion</tiny-radio>
<tiny-radio label="legend">传奇:legend</tiny-radio>
<tiny-radio label="default">默认：default</tiny-radio>
<tiny-radio label="classic">经典：classic</tiny-radio>
<tiny-radio label="simple">简约：simple</tiny-radio>
<tiny-radio label="fashion">时尚：fashion</tiny-radio>
<tiny-radio label="legend">传奇：legend</tiny-radio>
</tiny-radio-group>
</div>
<tiny-container :pattern="pattern">

2
examples/sites/demos/pc/app/container/custom-with-height-composition-api.vue
View File

@ -22,7 +22,7 @@
<script setup lang="jsx">
import { ref } from 'vue'
import { Container as TinyContainer, Layout as TinyLayout } from '@opentiny/vue'
import { TinyContainer, TinyLayout } from '@opentiny/vue'
const pattern = ref('legend')
const asideWidth = ref(200)

6
examples/sites/demos/pc/app/container/webdoc/container.js
View File

@ -10,7 +10,7 @@ export default {
},
desc: {
'zh-CN':
'\n 组件接受<code>header</code>、<code> aside </code>、<code> footer </code>、<code> default </code> 四种插槽。<br>\n 通过<code> pattern </code> 来设置预定好的组件版型,版型决定了插槽是否显示以及显示位置。<br>\n ',
'\n 组件接受<code>header</code>、<code> aside </code>、<code> footer </code>、<code> default </code> 四种插槽。<br>\n 通过<code> pattern </code> 来设置预定好的组件版型，版型决定了插槽是否显示以及显示位置。<br>\n ',
'en-US':
'\n The component accepts <code>header</code>, <code>aside</code>, <code>footer</code>, and <code>default</code>. <br>\n The predefined component pattern is set by <code> pattern </code>. The pattern determines whether and where the slots are displayed. <br>\n '
},
@ -24,9 +24,9 @@ export default {
},
desc: {
'zh-CN':
'\n 通过 <code>headerHeight</code> 控制 <code>header（头部区域）</code>高度。<br>\n 通过 <code>footerHeight</code> 控制 <code>footer（底部区域）</code>高度。<br>\n 通过 <code>asideWidth</code> 控制 <code>aside(左侧区域)</code>高度。<br>\n 而<code>default（主体区域）</code> 的宽度和高度是自适应的。\n ',
'\n 通过 <code>headerHeight</code> 控制 header（头部区域）的高度。<br>\n 通过 <code>footerHeight</code> 控制 footer（底部区域）的高度。<br>\n 通过 <code>asideWidth</code> 控制 aside（左侧区域）的宽度。<br>\n 而 main（主体区域） 的宽度和高度是自适应的。\n ',
'en-US':
'\n The <code>header (header area) </code> height is controlled by <code>headerHeight</code>. <br>\n Control the height of <code>footer (bottom area) </code> by <code>footerHeight</code>. <br>\n Control the <code>aside(left area)</code> height using <code>asideWidth</code>. <br>\n The width and height of <code>main </code> are adaptive.\n '
'\n The header (header area) height is controlled by <code>headerHeight</code>. <br>\n Control the height of footer (bottom area) by <code>footerHeight</code>. <br>\n Control the aside(left area) width using <code>asideWidth</code>. <br>\n The width and height of <code>main </code> are adaptive.\n '
},
codeFiles: ['custom-with-height.vue']
}