Использование всплывающей подсказки Nativescript vue - PullRequest
Новая
       11

Использование всплывающей подсказки Nativescript vue

0 голосов
/ 15 апреля 2019

Я использую nativescript vue

Я хочу запустить эту подсказку .

код как в учебнике не работает: 

 <Button text="Get Json Data" id="tool" ref="tooltip" @tap="getData" class="btn btn-primary m-t-20"></Button>

Я сделал кнопку, как это, и в создан, пытаясь заставить его работать, но 

 created() {
     let tipref = this.$refs.tooltip;
     let tippref = this.$refs.page.tooltip;
     //new ToolTip(this.nativeView.topmost().tip,{text:"Text"});
     //const tip = new ToolTip(this.nativeView.tipref,{text:"Some Text"});
     new ToolTip(tipref,{text:"Some Text"});   
},

все еще не работает: TypeError: Cannot read property 'tooltip' of undefined TypeError: Cannot read property 'nativeView' of undefined

Не могу понять, как это сделать.

Код из ответа Как создать плавающий макет справки? тоже не работает.

1 Ответ

0 голосов
/ 15 апреля 2019

Чтобы получить доступ к NativeScript View через ref, вам нужно сделать this.$refs.tooltip.nativeView. Также подождите, пока загруженное событие элемента не будет готово к использованию. 

<template>
  <Page class="page">
    <ActionBar title="Home" class="action-bar"/>
    <ScrollView>
      <StackLayout class="home-panel">
        <Button
          text="Get Json Data"
          ref="tooltip"
          class="btn btn-primary m-t-20"
          @loaded="onLoaded"
        ></Button>
      </StackLayout>
    </ScrollView>
  </Page>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    onLoaded: function(args) {
      const ToolTip = require("nativescript-tooltip").ToolTip;
      const tip = new ToolTip(args.object, {
        text: "Some Text",
        backgroundColor: "pink",
        textColor: "black"
      });
      tip.show();
    }
  }
};
</script>
...