怎样实现一个带图片显示的模态视图弹窗呢？？？？？？有时间pp电子确有这个需求，，，，，自己实现？？？？？？不不不，，，，，哪有官方的利便！

下面我来介绍一种使用官方组件就能实现的要领：

5G">首先找到官方文档：?显示模态弹窗的API wx.showModal(OBJECT) 

wx.showModal参数介绍

发明并没有设置图片的参数，，，，，可是这是一个API，，，，，可是组件呢？？？？？？我并没有在官方文档中找到，，，，，可是经由实验发明是可以显示一个模态弹窗的，，，，，即：

1. wx.showModal({

2. title: '提醒',

3. content: '这是一个模态弹窗',

4. success: function(res) {

5. if (res.confirm) {

6. console.log('用户点击确定')

7. } else if (res.cancel) {

8. console.log('用户点击作废')

9. }

10. }

11. })

可以改写为：

1. <modal title='提醒' hidden="{{modalHidden}}" bindcancel='modalCancel' bindConfirm='modalConfirm'>

2. 这是一个模态弹窗

3. </modal>

可是是否隐藏，，，，，确认以及作废的回调都需要自己手动绑定至js举行控制，，，，，效果照旧一样的

通俗模态弹窗  下面我们给他加上图片：

//wxml: 代码如下

1. <view class='container'>

2.  

3. <button class='button' bindtap='buttonTap' type='primary'>显示弹窗</button>

4.  

5. <modal title="我是问题" hidden="{{modalHidden}}" bindconfirm="modalConfirm" bindcancel="modalCandel">

6. <view>

7. <image class="image" src="/images/image.jpg" mode='aspectFill'></image>

8. </view>

9. //需要换行的话直接添加view标签

10. <view>You say that you love rain,</view>

11. <view>but you open your umbrella when it rains...</view>

12. You say that you love the sun,

13. but you find a shadow spot when the sun shines...

14. You say that you love the wind,

15. But you close your windows when wind blows...

16. This is why I am afraid; You say that you love me too...

17. </modal>

18.  

19. </view>

//js: 代码如下

1. Page({

2.  

3. /**

4. * 页面的初始数据

5. */

6. data: {

7. modalHidden: true

8. },

9.  

10. /**

11. * 显示弹窗

12. */

13. buttonTap: function() {

14. this.setData({

15. modalHidden: false

16. })

17. },

18.  

19. /**

20. * 点击作废

21. */

22. modalCandel: function() {

23. // do something

24. this.setData({

25. modalHidden: true

26. })

27. },

28.  

29. /**

30. * 点击确认

31. */

32. modalConfirm: function() {

33. // do something

34. this.setData({

35. modalHidden: true

36. })

37. }

38. })

带图片模态弹窗  我们还可以定制图片巨细！！。

wxss: 代码

1. .image {

2. width: 150rpx;

3. height: 120rpx;

4. margin: 10rpx 20rpx 0rpx 0rpx;

5. float: left;

6. }

这样子的话着实各人就明确了，，，，，只是一个容器，，，，，各人可以恣意的施展想象去定制，，，，，既不必完全自己去实现一个自界说模态弹窗视图，，，，，又可以挣脱官方wx.showModal的简陋