百度智能小程序 溫馨提示

prompt 溫馨提示

解釋： 溫馨提示組件，可配置標題內(nèi)容，提示內(nèi)容，并可放置在頁面的任何位置。

屬性說明

示例 

在開發(fā)者工具中打開

代碼示例

<view class="wrap">
    <view class="container">
        <view class="card-panel">
            <view class="comp-wrap">
                <smt-prompt>
                    <view slot="title">標題名稱</view>
                    <view slot="content">內(nèi)容信息描述，支持多行信息展示，高度根據(jù)內(nèi)容信息自適應(yīng)</view>
                </smt-prompt>
            </view>
        </view>
        <view class="card-panel">
            <view class="comp-wrap">
                <smt-prompt content-class="prompt-content">
                    <view slot="title">標題名稱</view>
                    <view slot="content">
                        內(nèi)容信息描述，支持多行信息展示，高度根據(jù)內(nèi)容信息自適應(yīng)<view class="content-herf" bindtap="clkTextShow">文字鏈接</view>
                    </view>
                </smt-prompt>
            </view>
        </view>
    </view>
</view>

Page({

    /**
     * 文字鏈接點擊事件
     */
    clkTextShow() {
        swan.showToast({
            title: '暫未配置鏈接',
            icon: 'none'
        });
    }
});

.wrap {
    height: 100vh;
}

.smt-card-area {
    margin-top: 25.36rpx;
}

.card-panel:first-child {
    margin-top: 0;
}

.card-area {
    display: flex;
    margin: 90.58rpx 0 0;
    padding: 28.382rpx 30.797rpx;
    border: none;
    border-radius: 0;
    transition: background-color 200ms linear;
    align-items: center;
    justify-content: space-between;
}

.comp-wrap {
    background-color: #fff;
    margin-top: 25.362rpx;
    padding: 27.174rpx 30.797rpx;
}

.prompt-content {
    font-size: 25.362rpx;
    line-height: 1.5;
    color: #999;
}

.prompt-content .content-herf {
    color: #2772fb;
    display: inline;
}

{
    "navigationBarTitleText": "溫馨提示",
    "navigationStyle": "default",
    "usingComponents": {
        "smt-prompt": "@smt-ui/component/src/prompt"
    }
}