Nativescript-vue：如何使自定义组件可点击？

Question

我可以使自定义元素可点按吗？

这是我的组件：

<template>
  <FlexboxLayout class="profile-item" flexDirection="column">
    <label :text="text" />
    <label class="subtext" v-if="subtext" :text="subtext" />
  </FlexboxLayout>
</template>

这就是我想使用它的方式：

<template>
  <ScrollView>
    <StackLayout>
      <Item text="Test" @tap="onItemTap" />
      <Button text="Button" @tap="onItemTap" />
    </StackLayout>
  </ScrollView>
</template>

<script>
import Item from "./Item";

export default {
  components: {
    Item
  },
  methods: {
    onItemTap(event) {
      alert('test');
    },
  }
};
</script>

点击按钮有效，但我的自定义元素无效。

Answer 1

您可以从自定义元素内部处理点击事件，或者将自定义元素包装在 ContentView 中并将点击事件附加到容器，如下所示：

<template>
  <ScrollView>
    <StackLayout>
      <ContentView @tap="onItemTap">
        <Item text="Test" />
      </ContentView>
      <Button text="Button" @tap="onItemTap" />
    </StackLayout>
  </ScrollView>
</template>

Nativescript-vue：如何使自定义组件可点击？

Nativescript-vue: How to make a custom component tapable?

nativescript

nativescript-vue