0

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>`
})

2 Answers 2

1

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.

Sign up to request clarification or add additional context in comments.

Comments

0

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
  },
  // ...
}

1 Comment

This wont apply for vue projects that use CDN setup

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.