forked from opentiny/tiny-vue
docs(breadcrumb): optimize breadcrumb docs (#547)
* docs(breadcrumb): modify component description * docs(breadcrumb): adjust the order of api * docs(breadcrumb): optimize api docs * docs(breadcrumb): optimize demo docs * docs(breadcrumb): adjust the order of api
This commit is contained in:
Binks_
GitHub
parent
b2600ce1f7
commit
0ff09c23c6
|
|
@ -8,7 +8,7 @@
|
|||
</tiny-breadcrumb>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Breadcrumb as TinyBreadcrumb, BreadcrumbItem as TinyBreadcrumbItem, Notify } from '@opentiny/vue'
|
||||
|
||||
function breadcrumbClick(value) {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-breadcrumb>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { computed } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { Breadcrumb as TinyBreadcrumb, BreadcrumbItem as TinyBreadcrumbItem } from '@opentiny/vue'
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
</tiny-breadcrumb>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Breadcrumb, BreadcrumbItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
</tiny-breadcrumb>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Breadcrumb, BreadcrumbItem, Notify } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { Breadcrumb as TinyBreadcrumb, Notify } from '@opentiny/vue'
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Breadcrumb, Notify } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Breadcrumb as TinyBreadcrumb, BreadcrumbItem as TinyBreadcrumbItem } from '@opentiny/vue'
|
||||
import { iconBoat } from '@opentiny/vue-icon'
|
||||
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Breadcrumb, BreadcrumbItem } from '@opentiny/vue'
|
||||
import { IconBoat } from '@opentiny/vue-icon'
|
||||
|
||||
|
|
|
|||
|
|
@ -10,6 +10,6 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="jsx">
|
||||
<script setup>
|
||||
import { Breadcrumb as TinyBreadcrumb, BreadcrumbItem as TinyBreadcrumbItem } from '@opentiny/vue'
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="jsx">
|
||||
<script>
|
||||
import { Breadcrumb, BreadcrumbItem } from '@opentiny/vue'
|
||||
|
||||
export default {
|
||||
|
|
|
|||
|
|
@ -4,4 +4,4 @@ title: Breadcrumb 面包屑
|
|||
|
||||
# Breadcrumb 面包屑
|
||||
|
||||
<div>Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。</div>
|
||||
<div>显示当前页面的位置，并能返回之前的任意页面。</div>
|
||||
|
|
|
|||
|
|
@ -4,4 +4,4 @@ title: Breadcrumb
|
|||
|
||||
# Breadcrumb
|
||||
|
||||
<div>Breadcrumb navigation, which tells visitors where they are currently on the site and how to get back.</div>
|
||||
<div>Shows the location of the current page and can return to any previous page.</div>
|
||||
|
|
|
|||
|
|
@ -34,9 +34,9 @@ export default {
|
|||
'name': { 'zh-CN': 'options 配置', 'en-US': 'options configuration' },
|
||||
'desc': {
|
||||
'zh-CN':
|
||||
'<p>通过 <code>options</code> 总体配置每个 <code>BreadcrumbItem</code>。 </p> 设置<code>text-field</code> 指定显示字段，默认显示字段为 <code>label</code>\n',
|
||||
'<p>通过 <code>options</code> 总体配置每个 <code>BreadcrumbItem</code>。 </p> 设置<code>text-field</code> 指定显示字段，默认显示字段为 <code>label</code>。\n',
|
||||
'en-US':
|
||||
'<p>Totally configure each <code>BreadcrumbItem</code> via <code>options</code>. </p>Set <code>text-field</code> to specify the field to be displayed. The default field to be displayed is <code>label</code>\n'
|
||||
'<p>Totally configure each <code>BreadcrumbItem</code> via <code>options</code>. </p>Set <code>text-field</code> to specify the field to be displayed. The default field to be displayed is <code>label</code>.\n'
|
||||
},
|
||||
'codeFiles': ['options.vue']
|
||||
}
|
||||
|
|
@ -45,10 +45,17 @@ export default {
|
|||
{
|
||||
'name': 'breadcrumb',
|
||||
'type': 'component',
|
||||
'properties': [],
|
||||
'events': [],
|
||||
'slots': [],
|
||||
'breadcrumb-attrs': [
|
||||
'props': [
|
||||
{
|
||||
'name': 'options',
|
||||
'type': 'Array',
|
||||
'defaultValue': '该属性的默认值为 []',
|
||||
'desc': {
|
||||
'zh-CN': '配置 options ,可以单独使用 tiny-breadcrumb 组件',
|
||||
'en-US': 'Configure options. The tiny-breadcrumb component can be used independently.'
|
||||
},
|
||||
'demoId': 'options'
|
||||
},
|
||||
{
|
||||
'name': 'separator',
|
||||
'type': 'String',
|
||||
|
|
@ -63,16 +70,6 @@ export default {
|
|||
'desc': { 'zh-CN': '图标分隔符 class', 'en-US': 'Icon separator class' },
|
||||
'demoId': 'separator'
|
||||
},
|
||||
{
|
||||
'name': 'options',
|
||||
'type': 'Array',
|
||||
'defaultValue': '[]',
|
||||
'desc': {
|
||||
'zh-CN': '配置 options ,可以单独使用 tiny-breadcrumb 组件',
|
||||
'en-US': 'Configure options. The tiny-breadcrumb component can be used independently.'
|
||||
},
|
||||
'demoId': 'options'
|
||||
},
|
||||
{
|
||||
'name': 'text-field',
|
||||
'type': 'String',
|
||||
|
|
@ -85,7 +82,7 @@ export default {
|
|||
'demoId': 'options'
|
||||
}
|
||||
],
|
||||
'breadcrumb-events': [
|
||||
'events': [
|
||||
{
|
||||
'name': 'select',
|
||||
'type': 'Function',
|
||||
|
|
@ -96,17 +93,18 @@ export default {
|
|||
},
|
||||
'demoId': 'options'
|
||||
}
|
||||
],
|
||||
'breadcrumbItem-attrs': [
|
||||
]
|
||||
},
|
||||
{
|
||||
'name': 'breadcrumbItem',
|
||||
'type': 'component',
|
||||
'props': [
|
||||
{
|
||||
'name': 'to',
|
||||
'type': 'String , Object',
|
||||
'name': 'label',
|
||||
'type': 'String',
|
||||
'defaultValue': '',
|
||||
'desc': {
|
||||
'zh-CN': '路由跳转对象，同 vue-router 的 to',
|
||||
'en-US': 'Route redirection object, which is the same as to of vue-router'
|
||||
},
|
||||
'demoId': 'slot-default'
|
||||
'desc': { 'zh-CN': '定义面包屑的显示值', 'en-US': 'Define the breadcrumb display value.' },
|
||||
'demoId': 'base'
|
||||
},
|
||||
{
|
||||
'name': 'replace',
|
||||
|
|
@ -119,23 +117,17 @@ export default {
|
|||
'demoId': 'slot-default'
|
||||
},
|
||||
{
|
||||
'name': 'label',
|
||||
'type': 'String',
|
||||
'name': 'to',
|
||||
'type': 'String , Object',
|
||||
'defaultValue': '',
|
||||
'desc': { 'zh-CN': '定义面包屑的显示值', 'en-US': 'Define the breadcrumb display value.' },
|
||||
'demoId': 'base'
|
||||
}
|
||||
],
|
||||
'breadcrumbItem-slots': [
|
||||
{
|
||||
'name': 'default',
|
||||
'type': '',
|
||||
'defaultValue': '',
|
||||
'desc': { 'zh-CN': '默认插槽', 'en-US': 'Default slot' },
|
||||
'desc': {
|
||||
'zh-CN': '路由跳转对象，同 vue-router 的 to',
|
||||
'en-US': 'Route redirection object, which is the same as to of vue-router'
|
||||
},
|
||||
'demoId': 'slot-default'
|
||||
}
|
||||
],
|
||||
'breadcrumbItem-events': [
|
||||
'events': [
|
||||
{
|
||||
'name': 'select',
|
||||
'type': '',
|
||||
|
|
@ -146,6 +138,15 @@ export default {
|
|||
},
|
||||
'demoId': 'base'
|
||||
}
|
||||
],
|
||||
'slots': [
|
||||
{
|
||||
'name': 'default',
|
||||
'type': '',
|
||||
'defaultValue': '',
|
||||
'desc': { 'zh-CN': '默认插槽', 'en-US': 'Default slot' },
|
||||
'demoId': 'slot-default'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
|
|
|||
Loading…
Reference in New Issue