uni-app小程序提示信息(信息提示)

首先

注意
如果当我们使用别人写好的框架是不能在框架里面加弹框信息,因为我们这个弹框属于自己的后期自己加的内容。需要在在嵌套一个然后再把信息提示的提示放到view里面。

代码如下

html代码

<view>
		
		<gui-top-message ref="guitopmsg1">
			<view class="gui-bg-green">
				<text class="message-text gui-block-text gui-color-white gui-icons"> {{ msg }}text>
			view>
		gui-top-message>
		
		<gui-top-message ref="guitopmsg2">
			<view class="gui-bg-red">
				<text class="message-text gui-block-text gui-color-white gui-icons"> {{ msg }}text>
			view>
		gui-top-message>
		
		<gui-top-message ref="guitopmsg3">
			<view style="background-color:rgba(0, 255, 0, 0.8);">
				<text class="message-text gui-block-text gui-color-white gui-icons"> {{ msg }}text>
			view>
		gui-top-message>
········<--  其他代码的,或是框架>
········<--  其他代码的,或是框架>
········<--  其他代码的,或是框架>
········<--  其他代码的,或是框架>
view>

JS代码

<script>
data() {
		return {
				msg: ''
			   };
		},
methods: {
		openmsg1: function() {
			this.$refs.guitopmsg1.open();
		},
		openmsg2: function() {
			this.$refs.guitopmsg2.open();
		},
		openmsg3: function() {
			this.$refs.guitopmsg3.open();
		},
			uni.showModal({//提示框
					title: '确定要删除吗?',
					complete: e => {
						if (e.confirm) {
							uni.request({
								url:"jakdj/ada",
								data: {
									//参数
								},
								success: res => {
									setTimeout(() => {
										this.msg = "订单已删除"
										this.openmsg3();
									}, 300);
								}
							});
						}
					}
				});
	}
script>
<--样式>
<style>
	.message-text {
		line-height: 88rpx;
		font-size: 26rpx;
		text-align: center;
	}
style>

你可能感兴趣的:(前台app,uni-app)