[Vuejs]-Get vue component in different page with button click on another vue component or html button click

0๐Ÿ‘

โœ…

As my R&D there were no solution with redirecting to different page. therefore I have decided to hide the content of existing page with button click in vue component and show the the content which I want with button click.

-Get Vue component in blade

<div id="vue-app">
    <add-price>

    </add-price>
</div>

-Vue component

#ListTable (id of existing content of the page)

<template>
  <div class="container">
    <a class="contentButton ml-n5" id="addPrice" @click="addPrice">Add Price<i class="fa fa-plus-circle"></i></a>
  </div>
</template>

<script>
export default {
name: "AddPrice",
  data() {
    return {
      isShow: false
    }
  },
  methods: {
    addPrice: function (){
      let x = $('#ListTable');
      x.hide();
      this.isShow = true;
    }
  }
}
</script>

Thanks everyone!

Leave a comment