SoFunction
Updated on 2025-04-05

vue3.0 CLI - 2.2 - Preliminary transformation of components

My github address -vue3.0Study - The learning results of stages will be branched.

All moved to the about route.

<template><div class="about"><HelloWorld msg="Links to vue official information"/></div></template>
<script>
import HelloWorld from '@/components/'
export default { name: 'about', components: { HelloWorld } }
</script>

Let's start organizing and using background data/journalismApi

Post the script code first:

export default {
 name: 'home',
 data: function (){
 return {
  navs: {},
  tts:[]
 }
 },
 created: function (){
 fetch('/journalismApi')
 .then(v=>())
 .then(v=>{
  ();
   = ;
   = ;
 });
 }
}

The component has two properties: the navs and the tts properties. Use the following code in template:

<template>
 <div class="home">
 <div class="nav">
  <div v-for="(value, key, index) in navs" :key="index">
  {{key}}
  </div>
 </div>
 <ul>
  <li v-for="(tt,index) in tts" :key="index">
  {{}}
  </li>
 </ul>
 </div>
</template>

This transformation process is relatively simple, so I won't introduce it much. Also create a git branch upload.

Summarize

The above is the preliminary transformation of vue3.0 CLI - 2.2 - components introduced to you by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. Thank you very much for your support for my website!