1234567891011121314151617181920212223242526272829303132333435363738394041 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>index</title>
- </head>
- <body>
- <!-- <h3>this is node -> Vue test</h3> -->
- <div id='app' style='color:red; font-size:20px; font-weight:bold;'>app node start...</div>
- <template id="my-app">
- <!--<div v-html='info'></div>
- <Home @op="add">home vue</Home>
- <h5 style="color:oranged">{{number}}</h5>
- <About>this is About</About>
- <test></test>-->
- <!--避免使用单标签,组件按照双标签规范用; js代码相对位置导入后可以直接使用 -->
- <p>before i18n label</p>
- <div v-t="'messages.username'"></div>
- {{$t('messages.login')}}
- <p>after i18n label</p>
- <button @click="changelang('zh')">中文</button>
- <button @click="changelang('en')">english</button>
- <!--<input type="button" text="中文" @click="changelang('zh')"/>
- <input type="button" text="english" @click="changelang('en')"/>-->
- <p>
- <router-link to="/home">首页</router-link>
- <router-link to="/test">test</router-link>
- <router-link to="/about">关于</router-link>
- </p>
- <router-view></router-view>
- </template>
- <template style="width:100%; backgroud-color:oranged;">
- <Home @op="add">home vue</Home>
- <h2>{{number}}</h2>
- </template>
- </body>
- </html>
|