条件构造在vue.js中不起作用

Question

我用一个v-if语句封装了一个模板标记，只有在注册类型是引用时才会出现。如果v-if的计算结果为true，则在此模板标记中显示某个消息，还有其他嵌套的v- if。

在上面的模板标记之外，我有一个v-else，如果注册类型不是推荐注册，它应该显示特定的消息。现在的问题是，推荐和非推荐注册的消息在推荐注册期间显示，但非推荐注册显示正确的消息。

下面是相关的代码。

            <template v-if="isReferralSignup">

                    <p v-if="canGetReferrerName" class="h4 pt-3 text-center">
                        Sign up to claim this investment from
                        <strong class="text-danger">
                            {{ReferrerFirstName}}
                        </strong>  and
                        get up to &#8358;{{RewardPerReferral}} in referral bonus
                    </p>
                    <p v-if="canGetReferrerName == false" class="h4 pt-3 text-center">
                        Sign up and get up to &#8358;{{RewardPerReferral}} referral bonus
                    </p>              
            </template>


            <p v-else class="h4 pt-3 text-center">
                You're opening a {{SelectedAccountName}} account
            </p>

下面是我用来检查它是否是推荐的函数

  isReferralSignup: function () {
                var self = this;
                var signUpUrl = document.location.href
                var splitUrlSegments = signUpUrl.split("/")
                var referralCode = splitUrlSegments[5]
                if (typeof referralCode === "undefined" || referralCode == ""  ) {
                    return false;
                } else if (referralCode.length == 6 || referralCode.length > 6) {
                    self.referralCode === referralCode
                    return true;
                }
            },

请重新安排我的代码，使其按预期工作？

谢谢。附言:我正在使用Vue.Js

Answer 1

为v-else保留相同的标记

<template v-else>
   <p class="h4 pt-3 text-center">
      You're opening a {{SelectedAccountName}} account
   </p>
</template>

Answer 2

您忘记了启动v-else条件的模板标记。

试一试：

<template v-else>
   <p class="h4 pt-3 text-center">
      You're opening a {{SelectedAccountName}} account
   </p>
</template>