跳到主要内容
link
以文本为基础，可点击触发交互，到其他网页或触发某些动作。
用法
样式
可访问性

示例​

类型​

PCPhonePad
<page>
    <module title="info类型的form">
        <form type="info" clear-button="{{false}}" confirm-button="{{false}}">
            <item name="linkList1" node="link" label="超链接列表1" bind-command="handleDropdownCommand" value="{[
                    { label: '8712837123', value: '1', icon: 'x-icon-action-copy' },
                    { label: '8712837124', value: '2', icon: 'x-icon-action-copy' },
                ]}">
            </item>
            <item name="linkList2" node="link" label="超链接列表2" bind-command="handleDropdownCommand" value="{[
                    { label: '8712837123', value: '1', icon: 'x-icon-action-copy', disabled: true, },
                    { label: '8712837124', value: '2', icon: 'x-icon-action-copy' },
                    { label: '8712837125', value: '3', icon: 'x-icon-action-copy' },
                    { label: '8712837126', value: '4', divided: true },
                    { label: '8712837127', value: '5', divided: true },
                    { label: '8712837128', value: '6', divided: true },
                    { label: '8712837129', value: '7', divided: true },
                ]}">
            </item>
            <item
                label="超链接"
                name="link"
                node="link"
                value="{{'自定义点击事件'}}"
                @click="linkClick"
            />
            <item
                label="超链接"
                name="link1"
                node="link"
                value="{{'我就是超链接'}}"
                href="{{'https://cabinx.dmall.com'}}"
                target="{{'_blank'}}"
            />
        </form>
    </module>

    <module title="base类型的form">
        <form type="base" clear-button="{{false}}" confirm-button="{{false}}">
            <item name="linkList1" node="link" label="超链接列表1" bind-command="handleDropdownCommand" value="{[
                    { label: '8712837123', value: '1', icon: 'x-icon-action-copy' },
                    { label: '8712837124', value: '2', icon: 'x-icon-action-copy' },
                ]}">
            </item>
            <item name="linkList2" node="link" label="超链接列表2" bind-command="handleDropdownCommand" value="{[
                    { label: '8712837123', value: '1', icon: 'x-icon-action-copy', disabled: true, },
                    { label: '8712837124', value: '2', icon: 'x-icon-action-copy' },
                    { label: '8712837125', value: '3', icon: 'x-icon-action-copy' },
                    { label: '8712837126', value: '4', divided: true },
                    { label: '8712837127', value: '5', divided: true },
                    { label: '8712837128', value: '6', divided: true },
                    { label: '8712837129', value: '7', divided: true },
                ]}">
            </item>
            <item
                label="超链接"
                name="link"
                node="link"
                value="{{'自定义点击事件'}}"
                @click="linkClick"
            />
            <item
                label="超链接"
                name="link1"
                node="link"
                value="{{'我就是超链接'}}"
                href="{{'https://cabinx.dmall.com'}}"
                target="{{'_blank'}}"
            />
        </form>
    </module>
</page>

export default XPage({
    linkClick(e) {
        console.info('link点击了', e);
    },

    handleDropdownCommand(command) {
        console.info('command', command);
    },
});


Attributes​

参数说明类型可选值默认值端版本
value显示文案/列表项String/Array<{label: String, value: any, disabled: Boolean, tips: String}>----PC/Mobile--
href链接地址String----PC/Mobile--
target链接跳转方式String_self/_blank_selfPC/Mobile--
disabled禁用Booleantrue/falsefalsePC/Mobile--

Events​

名称说明回调参数端版本
click点击事件(value属性是String)--PC/Mobile--
command点击列表项回调(value属性是Array)--PC/Mobile--