首先新建一个项目
然后下载相应的api
首先配置App.vue
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
createApp(App).use(router).mount('#app')
import axios from 'axios'
const instance = axios.create({
baseURL:'https://cnodejs.org/api/v1'
})
export default instance
import axios from '../utils/request';
//请求列表的函数
export const getTopics = (params) => axios('/topics',{params})
//根据id获取详情
export const getTopic = (id,params) => axios.get(`/topic/${id}`,{params})
import { ref,onMounted } from 'vue'
import { getTopics } from '../api/topics'
export default function useTopics(){
/**
* 数据渲染功能
*/
//声明 数据
const topics = ref([])
//请求数据
onMounted(async () => {
const res =await getTopics()
topics.value = res.data.data
})
return {
topics
}
}
import { useRouter } from 'vue-router'
export default function useTopics(){
//跳转
const router = useRouter()
const go = (id) =>{
router.push('/detail?id=' + id)
}
return {
go
}
}
-
{{topic.title}}
{{topic.title}}
{{topic.author?.loginname}}
{{topic.create_at}}
即可实现数据的渲染以及跳转功能
文章为作者独立观点,不代表股票交易接口观点