图片网站模板,wordpress apache伪静态,做网站运营工作流程,工程项目编号查询系统由于微信小程序的wx.showModal不支持富文本内容#xff0c;无法实现更灵活的展示效果#xff0c;故需要进行二次封装 实现思路#xff1a;使用van-dialog以及微信小程序的rich-text实现
代码如下#xff1a;
// index.wxml
van-dialoguse-slottitle提示s… 由于微信小程序的wx.showModal不支持富文本内容无法实现更灵活的展示效果故需要进行二次封装 实现思路使用van-dialog以及微信小程序的rich-text实现
代码如下
// index.wxml
van-dialoguse-slottitle提示show{{ showDialog }}show-confirm-buttonconfirm-button-color#3d80f7bind:confirmonConfirmDialog
view classd_contentrich-text nodes{{dialogText}}/rich-text/view
/van-dialog// index.js
Page({
data: {showDialog: false,dialogText: ,confirmCallback: null,},onCloseDialog() {this.setData({ showDialog: false }, () {wx.showTabBar({animation: true,});setTimeout(() {this.setData({dialogText: ,confirmCallback: null,});}, 300);});},onShowDialog(type, msg, rMsg, fn) {switch (type) {case model:this.setData({showDialog: true,dialogText: p styletext-align: justify;span stylecolor: rgba(0, 0, 0, 0.5);${msg}/span/p,confirmCallback: fn ? fn : null,},() {wx.hideTabBar({animation: true,});});break;case reject:let mArray msg.split(rMsg);let text p styletext-align: left;text-align: justify;span stylecolor: rgb(140, 140, 140);${mArray[0]}/spanspan stylecolor: #ff5858;${rMsg}/spanspan stylecolor: rgb(140, 140, 140);${mArray[1]}/span/p;this.setData({showDialog: true,dialogText: text,confirmCallback: fn ? fn : null,},() {wx.hideTabBar({animation: true,});});break;case custom:this.setData({showDialog: true,dialogText: msg,confirmCallback: fn ? fn : null,},() {wx.hideTabBar({animation: true,});});break;default:this.setData({showDialog: true,dialogText: msg,confirmCallback: fn ? fn : null,},() {wx.hideTabBar({animation: true,});});break;}},onConfirmDialog() {wx.showTabBar({animation: true,});this.onCloseDialog();if (typeof this.data.confirmCallback function) {this.data.confirmCallback();}},
})// index.json
{usingComponents: {van-dialog: vant/weapp/dialog/index}
}// index.wxss
.d_content {box-sizing: border-box;padding: 36rpx 46rpx;
}
使用方法
this.onShowDialog(model,您已向${subItem.name}申请权限请等待管理员审核。);
this.onShowDialog(reject,您的申请被拒绝原因为${subItem.reason}请根据拒绝原因检查您的提交信息点击确认继续。,subItem.reason,() {// ...});本文仅提供一种思路可能不是最优写法欢迎大家讨论留言
