CODEWITHSUNDEEP
javascriptvue.js
Avik Pradhan
Avik Pradhan

Reputation: 105

How to import vue js components?

I have two js file students.js and modal.js . How to import component in modal.js inside students.js? my students.js

Vue.component('student', {
 data: function(){

 },
 template:`
  <h1>Click to edit students</h1>
  // use modals.js component here..........

`
})

my modals.js

Vue.component('modal', {
 template:`
 <h1>This is modal.</h1>`
})

Upvotes: 0

Views: 1072

Answers (2)

Ashwin Bande
Ashwin Bande

Reputation: 3063

Vue.component globally registers the component so you can use it directly in any other component. Like this:

Vue.component('student', {
 data: function(){

 },
 template:`
  <h1>Click to edit students</h1>
  // use modals.js component here..........
  <modal v-bind:prop="something">....</modal>  // <= focus here
`
})

Note: Name your components according to style guide; names like modal is not suitable according to style guide, name it like my-modal where - should be in component name.

Upvotes: 1

HW Siew
HW Siew

Reputation: 1003

You can use import. For more information : https://v2.vuejs.org/v2/guide/components-registration.html

import ComponentA from './ComponentA'
import ComponentC from './ComponentC'

export default {
  components: {
    ComponentA,
    ComponentC
  },
  // ...
}

Upvotes: 0

Related Questions