Question

我有一个类似

的链接

this.dateDisplay = moment(formats.dateTimeValue).toISOString();

我想添加基于设备的if语句并更改功能名称。我尝试过

<a class="nav-link" data-toggle="modal" data-target="#testModal" @click="platform.os.family == 'iOS' ? showSettingiOS() : showSetting()">Test</a>

和

@click="platform.os.family == 'iOS' ? showSettingiOS() : showSetting()"

没有任何效果。我的@click="platform.os.family == 'iOS' ? 'showSettingiOS()' : 'showSetting()'"对象无法在函数内部使用，这就是为什么我尝试使用at href的原因。我做错了

Answer 1

对于复杂的条件逻辑，您可能应该使用一种方法而不是依赖内联评估：

<a class="nav-link" data-toggle="modal" data-target="#testModal" @click="click">Test</a>

methods: {
  click() {
    if (this.platform.os.family === 'iOS') {
      this.showSettingiOS();
    } 
    else {
      this.showSetting();
    }
  },

  showSettingiOS() {

  },
  showSetting() {

  }
}

编辑

如果platform的实例是父实例的实例，则可以将其provide应用于子组件：

// Parent
{
  provide() {
    return {
      platform
    }
  }
}

// Child    
{
  inject: [ 'platform' ]
}

Answer 2

终于解决了。我用

computed: {
    platform: () => platform,
},

在我的组件上正常工作。但是，platform如果没有它，则无处不在，但不能仅在iOS Webview中工作。

vuejs在@click事件中使用if语句

2 个答案:

编辑