मैंने अपने आवेदन में एक मुख्य वीयू ऐप जोड़ा है। और मैं ऐप में एक घटक जोड़ना चाहता हूं।

TopMenu.vue को App.vue में जोड़ने का प्रयास किया जा रहा है:

<top-menu></top-menu> App.vue में।

ऐप के लिए main.js में रजिस्टर्ड। क्या मैं एकल फ़ाइल घटकों का सही उपयोग कर रहा हूँ?

Main.js

import Vue from 'vue'
import App from './components/App'
import TopMenu from './components/TopMenu'

Vue({
  el: '#app',
  render: h => h(App),
  components: {
    'top-menu': TopMenu
  }
})

ऐप.व्यू:

<template>
  <div class="wrapper">
    <top-menu></top-menu>
    <div class="container drop-shadow">
      <h1>{{ message }}</h1>
      <p1>{{ about }}</p1>
    </div>
  </div>
</template>

<script>
export default {
  name: "App",
  data() {
    return {
      message: "Hello kosken!",
      about: "Using Parcel In A Vue.js App"
    };
  }
};
</script>

TopMenu.vue:

<template>
    <div class="user-menu drop-shadow"></div>
</template> 

<script>
    export default {
        name: 'top-menu',
        data: function () {
            return "somedata";
        }
    }
</script>
0
TheASDQWE 8 फरवरी 2019, 17:27

2 जवाब

सबसे बढ़िया उत्तर

आपको इसे आयात करना चाहिए और इसे अपने अंदर उपयोग करना चाहिए App.vue :

<template>
  <div class="wrapper">
    <top-menu></top-menu>
    <div class="container drop-shadow">
      <h1>{{ message }}</h1>
      <p1>{{ about }}</p1>
    </div>
  </div>
</template>

<script>
import TopMenu from './TopMenu'
export default {
  name: "App",
  data() {
    return {
      message: "Hello kosken!",
      about: "Using Parcel In A Vue.js App"
    };
  },  
  components: {
    'top-menu': TopMenu
  }
};
</script>
1
Boussadjra Brahim 8 फरवरी 2019, 17:34
import Vue from 'vue'
import App from './components/App'
import TopMenu from './components/TopMenu'

Vue.component('top-menu', TopMenu)

इस प्रकार आपको विश्व स्तर पर घटक पंजीकृत करना चाहिए और आप इसे कहीं भी उपयोग कर सकते हैं।

0
latovic 8 फरवरी 2019, 17:35