rigor789 / nativescript-vue-next

MIT License
90 stars 7 forks source link

Some event not working #624

Open Fabiyo-90 opened 2 years ago

Fabiyo-90 commented 2 years ago
<template>
  <Page ref="pageElt"  
      @loaded="pageLoaded"
      @navigatedFrom="onNavigatedFrom"
      @navigatedTo="onNavigatedTo"
      @navigatingTo="onNavigatingTo"
      @navigatingFrom="onNavigatingFrom">
    <ActionBar title="NsVue-3" />

    <RootLayout class="container" rows="*, *, *">
      <Label ref="labelMessage" :text="message" row="0" />

      <StackLayout row="1" horizontalAlignment="center">
        <Button text="tap on me" @tap="actions.tapOnButton(myStore)" width="150" height="50" row="1"
          class="bg-blue-500 rounded text-white shadow-indigo-200" />
        <Label :text="myStore.count" fontSize="25" color="red" />
        <Label :text="myStore.double" fontSize="25" color="green" />
        <Button text="navigate" @tap="navigate" width="150" height="50" row="1"
          class="bg-blue-500 rounded text-white shadow-indigo-200" />
      </StackLayout>

      <StackLayout row="2">
        <Label class="mdi" text="&#xF1165;" fontSize="25" />
      <TextField v-model="message" />
      </StackLayout>

    </RootLayout>

  </Page>

</template>

<script lang="ts">
import { 
  defineComponent, 
  ref,
  onMounted,
  $navigateTo
} from 'nativescript-vue';
import { UseCounterStore } from '~/store/counter';
import DrawerComponent from './Drawer.vue';

const actions = {
  tapOnButton(myStore: any) {
    myStore.increment();
  },

  test(elt: any) {
    let label = elt.nativeView;
    console.dir(label.text);
  },
};

export default defineComponent({
  name: "AppComponent",

  propos: [],

  components: {

  },

  setup() {
    let myStore = UseCounterStore();
    let pageElt = ref();
    let message = ref("Hello world !");

    onMounted(() => {

    });

    return {
      message,
      actions,
      myStore,
      pageLoaded() {
        console.log('Page loaded');
      },

       navigate() {
        $navigateTo(DrawerComponent, {});
      },

      onNavigatedTo() {
        console.log('onNavigatedTo', {message});
      },

      onNavigatedFrom() {
        console.log('onNavigatedFrom');
      },

      onNavigatingFrom() {
        console.log('onNavigatingFrom');
      },

      onNavigatingTo() {
        console.log('onNavigatingTo');
      }
    }
  }
});

</script>

I was playing nativescript-vue-next and some events not working. The event "@loaded", "@navigatedFrom", "@navigatedTo", "@navigatingFrom" and "@navigatingTo" are not working....