javascript 如何根据API响应设置一对按钮的默认值？VueJS

moiiocjp 于 2023-02-11 发布在 Java

关注(0)|答案(1)|浏览(112)

我有一对按钮，必须根据从API得到的响应进行切换。当页面加载时，按钮只需设置一次。

我用的代码是

<div class="small-7 column btn-switch">
          <span class="switch-statement">"Is it mandatory"</span>
          <button
            :class="!isMandatory ? 'button--secondary' : 'button--tertiary'"
            class="button button-border"
            @click="setMandatory(false)"
          >
           "No"
          </button>
          <button
            :class="isMandatory ? 'button--secondary' : 'button--tertiary'"
            class="button"
            role=`your text`"button"
            @click="setisMandatory(true)"
          >
            "Yes"
          </button>
        </div>

我试着用v-if作为按钮，正如我所预料的那样，它不起作用。有什么替代方法吗？

JavaScript

来源：https://stackoverflow.com/questions/75407698/how-to-set-default-value-for-a-pair-of-buttons-based-on-api-response-vuejs

1条答案

按热度按时间

58wvjzkj1#

isMandatory的值很可能会根据API调用的响应而改变，当页面第一次加载时，它将是你给它的任何默认值，当API稍后返回响应时，页面不会被刷新。
我需要更多关于代码结构的信息，但我目前的猜测是您需要将isMandatory转换为ref。
例如，如果您的代码如下所示：

<script setup>
  isMandatory = false;

  // -> some API call handling
  isMandatory = apiResponse
</script>
<template>
  ...
</template>

把它变成这样：

<script setup>
  isMandatory = ref(false);

  // -> some API call handling
  isMandatory.value = apiResponse
</script>
<template>
  ...
</template>

那么，每当isMandatory的值改变时，template将React性地改变。

赞(0）回复(0）举报 2023-02-11

我来回答

javascript 如何根据API响应设置一对按钮的默认值？VueJS

1条答案

相关问题

热门标签

最新问答