1.效果图：

2.

3.多种触发条件使用同一个弹窗：

4.*.js触发处：

5.this.setData({

6.isWrong:true,

7.wrongtap:1,

8.dialogWord:"wrong",

9.wrongDec:"答案错误，是否向好友求助？"

10.})

11.*.wxml布局：

12.viewclass="wrongDialog"wx:if="{{isWrong}}"

13.viewclass="box"

14.imageclass="bg"src="../../images/wrong_bg.png"

15./image

16.viewclass="main"

17.viewclass="wrong1"{{wrongDec}}/view

18.viewclass="wrong2"

19.blockwx:if="{{wrongtap==1}}"

20.viewclass="wrongBtnBox"

21.viewclass="wrongBtn"

22.!--答案错误取消--

23.imagebindtap='wrongQx'src="../../images/wrongQx.png"mode="aspectFit"/

24./view

25.viewclass="wrongBtn"

26.!--答案错误确定--

27.imagesrc="../../images/wrongOk.png"mode="aspectFit"/image

28.buttonclass='shareOk'data-word="{{dialogWord}}"open-type="share"bindtap='wrongOk'/button

29./view

30./view

31./block

32.blockwx:if="{{wrongtap==2}}"

33.viewclass="wrongBtnBox"

34.viewclass="wrongBtn"

35.!--提示取消--

36.imagebindtap='tishiQx'src="../../images/wrongQx.png"mode="aspectFit"/

37./view

38.viewclass="wrongBtn"

39.!--提示确定--

40.imagesrc="../../images/wrongOk.png"mode="aspectFit"/image

41.buttonclass='shareOk'data-word="{{dialogWord}}"open-type="share"bindtap='tishiOk'/button

42./view

43./view

44./block

45.blockwx:if="{{wrongtap==3}}"

46.viewclass="wrongBtnBox"

47.viewclass="wrongBtn"

48.!--点击金币取消--

49.imagebindtap='goldQx'src="../../images/wrongQx.png"mode="aspectFit"/

50./view

51.viewclass="wrongBtn"

52.!--点击金币确定--

53.imagesrc="../../images/wrongOk.png"mode="aspectFit"/image

54.buttonclass='shareOk'data-word="{{dialogWord}}"open-type="share"bindtap='goldOk'/button

55./view

56./view

57./block

58./view

59./view

60./view

61.*.wxss布局：

62..wrongDialog{

63.position:fixed;

64.z-index:100;

65.left:0;

66.top:0;

67.width:100%;

68.height:83%;

69.background-color:rgba(0,0,0,0.5);

70.}

71..wrongDialog.box{

72.width:80%;

73.height:364rpx;

74.position:absolute;

75.left:10%;

76.top:30%;

77.z-index:9

78.}

79..wrongDialog.box.bg{

80.width:90%;

81.height:100%;

82.margin:auto;

83.}

84..wrongDialog.box.main{

85.position:absolute;

86.left:50%;

87.top:0;

88.-webkit-transform:translate(-50%,0);

89.transform:translate(-50%,0);

90.width:522rpx;

91.height:100%;

92.}

93..wrongDialog.box.main.wrong1{

94.color:#a65d1c;

95.font-size:30rpx;

96.padding:140rpx000;

97.text-align:center;

98.}

99..wrongDialog.box.main.wrong2.wrongBtnBox{

100.width:100%;

101.height:100rpx;

102.vertical-align:middle;

103.text-align:center;

104.margin-top:13%

105.}

106..wrongDialog.box.main.wrong2.wrongBtnBox.wrongBtn{

107.position:relative;

108.width:160rpx;

109.height:100rpx;

110.display:inline-block;

111.margin:020rpx;

112.}

113..wrongDialog.box.main.wrong2.wrongBtnBox.wrongBtnimage{

114.vertical-align:middle;

115.display:inline

116.}

117..wrongDialog.box.main.wrong2.wrongBtnBox.wrongBtn.shareOk{

118.position:absolute;

119.display:block;

120.left:0;

121.top:0;

122.width:100%;

123.height:100%;

124.background:transparent;

125.}

126.button::after{

127.border:none;

128.}