Related InterviewSolutions

• <script>  export default {    data() {      return {        author: {          name: 'John Doe',          books: [            'Vue 2 - Advanced Guide',            'Vue 3 - Basic Guide',            'Vue 4 - The Mystery'          ]        }      }    },    computed: {      publishedBooksMessage() {        return this.author.books.length > 0 ? 'Yes' : 'No'      }    }  }  </script>    <template>    <p>Has published books:</p>    <span>{{ publishedBooksMessage }}</span>  </template> 
• Second: 
• <script>  export default {    data() {      return {        author: {          name: 'John Doe',          books: [            'Vue 2 - Advanced Guide',            'Vue 3 - Basic Guide',            'Vue 4 - The Mystery'          ]        }      }    },    methods: {      publishedBooksMessage() {        return this.author.books.length > 0 ? 'Yes' : 'No'      }    }  }  </script>  <template>    <p>Has published books:</p>    <span>{{ publishedBooksMessage() }}</span>  </template> 
• First: 
• The following two codes have the same output which is ‘yes’. Which one is more preferable performance-wise and why? 
• Explain the dissimilarity between one-way data flow and two-way data binding? Which vue.js directive is used for each?
• Why should arrow functions not be used in writing lifecycle hooks in Vue instances?
• Explain Vue.js common issues when tracking changes?
• const router = new VueRouter({         routes: [           { path: '/user/:name', component: User }            { path: '/user/:name', component: Admin }           { path: '/user/:name', component: Customer }         ]       }) 
• Does the following code have any errors? If yes, what is the error and how are you supposed to correct it? If not, which component (User,Admin,Customer) is going to be invoked when ‘/user/:name’ is navigated to.