Use ternary expressions in vue difference expressions

Vue's interpolation expression

{ {}} Some people call moustache grammar, also called double curly braces.
Function: Read the data in the data in vue, display it in the structure, update the data, and the view will also change.

Use ternary expressions in vue difference expressions

  <span>总开机时间:{
   
   { status.bootTime == null  ? 'N/A' : status.bootTime}}</span>
 data() {
    return {
      status:{
        bootTime:''
      },
    };
  },
 handleClick(tab, event) {
      if (tab.index == 2) {
        this.timer = setInterval(() => {
           this.$axios
          .get(
            "/api/app/robot/" + this.$store.state.robot.robot.items[0].id + "/status",
            {
              headers: {
                Authorization: "Bearer " + sessionStorage.access_token,
              },
            }
          )
          .then((res) => {
          //发请求后台返回的数据,用data中的数据进行接收之后用差值表达式配合三元表达式进行展示
            this.status.bootTime = res.data.bootTime
          })
          .catch((error) => {
            console.log(error);
          });
        }, 1000);
      } else {
        clearInterval(this.timer);
        this.timer = null;
      }
      // console.log(tab, event);
    },

Guess you like

Origin blog.csdn.net/weixin_40648700/article/details/112213269