Skip to content
vue
<component 
  :is="dynamicComponent" 
  :dynamic-data="dynamicData"
  @checkLanguage="checkLanguage"
/>
  <!-- <template v-if="isLoginForm">
    <login-form
      ref="login"
      :login-data="dynamicData.formData"
      :index="index"
      :locales="locales"
      @checkLanguage="checkLanguage"
    />
</template>
  <template v-else>
  <register-form :register-data="dynamicData.formData" />
</template> -->

使用vue内置<component></component>标签代替多重if判断,并且这个标签也能够进行父子组件之间的值传递、事件传递(可以使用计算属性以及一个守卫值来根据不同情况返回不同组件所需要的值)。需要注意的是该标签不支持**-**写法,仅支持大驼峰写法。通过内置标签可以简洁不少代码。