question: specific scenario description: scan the code, pay, and jump to the completion page, where there is payment price, store, and coupon information. Generally speaking, there is not much information on the page, and the code flow is not complex, just a presentation page. However, there is a certain probability that the page will be blank under ios, and the test has probably calculated that there are 1-2 times in 10 times (especially after Wechat quit and re-logged in). Copy the link after something goes wrong, and reopen it every time.

it"s weird to meet this problem, and I"m completely bewildered. At first, I thought that there was an error in the page (even if it was debugged by ios), I could only test whether the process could not work by alert breakpoint. It was found that there was no process blocking on the root page, and the print node was also ok. The citation order of external files was also optimized. Basically, I tried everything I could think of, but there was still a problem. Finally, I went on a whim (crazy). Click a point on the blank page (probably the location of the normal display amount), and find that you can copy the text, so you quickly copy it out to see-- the text is normal, that is to say, there is no problem with the code, node and data on the page. I feel that the data has not been updated and refreshed the dome tree at all, and the feeling of re-rendering (the page is not your own interface, but the colleague in the background is right. I did not use the framework of vue. I took a look at it. Useful to the data template rendering method, similar to the data rendering method like php, but the cPP language, can only understand, do not know the true meaning).

problem is checked here, and I probably know how to solve it-- it can be solved by directly transforming mixed development like php+html into a way of using vue framework-- the main reason is that the data is not unified with page rendering, and the rendering mode of vue can be solved

but this is definitely a violent solution-in other words, this page has less content and is easier to convert. If it is a complex page, it is estimated that my background colleagues will be full of women. I want to use a native way to update the dome tree dynamically, but I have found a lot, but I have not found any similar ones. If you have encountered similar problems, please give me some advice

add the code:

html
<div class="page">
    <div class="section">
        <div class="Sicon">
            <img src="~/Content/images/icon.png" />
        </div>

        <p class="Sstate t_center">

        <p class="Sprice t_center"> @orderInfo.OrderPrice

        <p class="Sname t_center">@ViewBag.StoreName




        @if (rebateList != null && rebateList.Count > 0)
            {
            <div class="paySline">
                <div class="flex f_relative f_center">
                    <span></span>
                    <hr />
                </div>
            </div>


            <div class="redList flex f_around @(rebateList.Count==2?"arrow":"")">

                @foreach (var item in rebateList)
                {
                    if (item.Type == (int)UserRebateType.OrderRebate)
                    {
                        <div class="redItem">
                            <p class="name t_o t_center">

                            <p class="price t_o t_center">@item.Amount 

                        </div>
                    }
                    else if (item.Type == (int)UserRebateType.WeekendRedPacket)
                    {
                        <div class="redItem">
                            <p class="name t_o t_center">

                            <p class="price t_o t_center">@item.Amount 

                        </div>
                    }
                    else if (item.Type == (int)UserRebateType.HighRedPacket)
                    {
                        <div class="redItem">
                            <p class="name t_o t_center">

                            <p class="price t_o t_center">@item.Amount 

                        </div>
                    }
                }

            </div>
        }


        <div class="paybtn flex f_center">
            <div class="SbtnLine flex f_center" onclick="closeWin()"></div>
        </div>
    </div>
</div>

//js
<script>
//
    function closeWin() {
        var ua = navigator.userAgent.toLowerCase();
        if (ua.match(/MicroMessenger/i) == "micromessenger") {
            WeixinJSBridge.call("closeWindow");
        } else if (ua.indexOf("alipay") != -1) {
            AlipayJSBridge.call("closeWebview");
        }
    }
</script>

normal effect of the page: