index.html 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>index</title>
  7. </head>
  8. <body>
  9. <!-- <h3>this is node -> Vue test</h3> -->
  10. <div id='app' style='color:red; font-size:20px; font-weight:bold;'>app node start...</div>
  11. <template id="my-app">
  12. <!--<div v-html='info'></div>
  13. <Home @op="add">home vue</Home>
  14. <h5 style="color:oranged">{{number}}</h5>
  15. <About>this is About</About>
  16. <test></test>-->
  17. <p>
  18. <router-link to="/home">首页</router-link>
  19. <router-link to="/test">test</router-link>
  20. <router-link to="/about">关于</router-link>
  21. </p>
  22. <router-view></router-view>
  23. <div class="flex flex-wrap gap-4 item-center">
  24. <el-select
  25. v-model="value"
  26. placeholder="Select"
  27. size="large"
  28. style="width: 240px"
  29. >
  30. <el-option
  31. v-for="item in options"
  32. :key="item.value"
  33. :label="item.label"
  34. :value="item.value"
  35. @click="changelang(item.value)"
  36. />
  37. </el-select>
  38. </div>
  39. <br/>
  40. <!--避免使用单标签,组件按照双标签规范用; js代码相对位置导入后可以直接使用 -->
  41. <!-- <p>before i18n label</p> -->
  42. <div v-t="'messages.username'"></div>
  43. {{$t('messages.login')}}
  44. <!-- <p>after i18n label</p> -->
  45. <!-- <label @click="changelang('zh')">中文</label>
  46. <label @click="changelang('en')">english</label> -->
  47. <hr/>
  48. <button @click="interface_web()">connect to tomcat</button>
  49. <br/>
  50. <h4>tomcat_res -></h4><h4> {{ tomcat_res==""?"content empty":tomcat_res }}</h4>
  51. <hr/>
  52. <h2>书籍列表</h2>
  53. <ul>
  54. <!-- <li v-for="(iterm,key,value) in books">{{value}}-{{key}}-{{item}}</li> -->
  55. <!-- <li>{{item}}</li> -->
  56. <li v-for="(value,key,iterm) in books">{{value.title}}&nbsp;{{value.author}}&nbsp;{{value.publisher}}&nbsp;{{value.pages}}</li>
  57. <!-- <li>{{item["title"]}}&nbsp;{{item["author"]}}&nbsp;{{item["publisher"]}}&nbsp;{{item["pages"]}}</li> -->
  58. </ul>
  59. <hr/>
  60. <!--<input type="button" text="中文" @click="changelang('zh')"/>
  61. <input type="button" text="english" @click="changelang('en')"/>-->
  62. </template>
  63. <!-- <template style="width:100%; backgroud-color:oranged;">
  64. <Home @op="add">home vue</Home>
  65. <h2>{{number}}</h2>
  66. </template> -->
  67. </body>
  68. </html>