当前位置：网站首页>Why is the operation unsuccessful (unresolved) uncaught syntaxerror: invalid or unexpected token (resolved)

Why is the operation unsuccessful (unresolved) uncaught syntaxerror: invalid or unexpected token (resolved)

2022-07-04 01:37:00 【hamimelon2020】 

<template>
<div>
  <div id="v-model-example" class="demo">
   <p>First name: {
    {
     firstName }}</p>
   <p>Last name: {
    {
     lastName }}</p>
   <user-name
    v-model:first-name="firstName"
    v-model:last-name="lastName"
  ></user-name>
</div>
</div>
</template>


<script>
export default  {
    
    name: 'item',
  props: {
    
    firstName: String,
    lastName: String
  },
  template: ` <input type="text" :value="firstName" @input="$emit('update:firstName', $event.target.value)"> <input type="text" :value="lastName" @input="$emit('update:lastName', $event.target.value)"> `
};

const HelloVueApp = {
    
  components: {
    
    UserName,
  },
  data() {
    
    return {
    
      firstName: 'John',
      lastName: 'Doe',
    };
  },
};

}
</script>

Missing a double quote 

<!DOCTYPE html>
<div id="v-model-example" class="demo">
   <p>First name: {
    {
     firstName }}</p>
   <p>Last name: {
    {
     lastName }}</p>
<user-name
   v-model:first-name="firstName"
   v-model:last-name="lastName">
   </user-name>
</div>

<script src="https://unpkg.com/[email protected]"></script>
<script>
    const app = Vue.createApp({
    });
    const UserName = {
    
       props: {
    
           firstName: String,
           lastName: String
       },
    emits: ['update:firstName', 'update:lastName'],
    template: ` <input type="text" :value="firstName" @input="$emit('update:firstName', $event.target.value)"> </br> <input type="text" :value="lastName" @input="$emit('update:lastName', $event.target.value)"> `
   }

   
   const HelloVueApp = {
    
      components: {
    
         UserName,
      },
      data() {
    
    return {
    
      firstName: 'John',
      lastName: 'Doe',
    };
  },
}

Vue.createApp(HelloVueApp).mount('#v-model-example')
</script>
原网站

版权声明
本文为[hamimelon2020]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/02/202202141917046041.html

边栏推荐

猜你喜欢

随机推荐