<template>
<div>
简单说就是里面只能有一个跟的div
button1.vue
<template> <div> <Button>Default</Button> <Button type="primary">Primary</Button> <Button type="dashed">Dashed</Button> <Button type="text">Text</Button> <br><br> <Button type="info">Info</Button> <Button type="success">Success</Button> <Button type="warning">Warning</Button> <Button type="error">Error</Button> </div> </template> <script> export default { name: "button1" } </script> <style scoped> </style>
app.vue
<template> <div id="app"> <img src="./assets/logo.png"> <br><br> <button1></button1> <router-view/> </div> </template> <script> import button1 from './components/button1'; export default { name: 'App', components: { button1 } } </script> <style> #app { font-family: 'Avenir', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; } </style>