Vue 3 使用作用域插槽、具名插槽、自定义指令的table案例

最新推荐文章于 2023-12-23 15:36:06 发布

HardworkLiao

最新推荐文章于 2023-12-23 15:36:06 发布

阅读量233

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/m0_52411807/article/details/125844088

版权

文章目录

一、使用的工具
二、项目目录
三、使用步骤
四、项目源码
五、项目效果
六、项目地址

一、使用的工具

VsCode
Vite
bootstrap
axios

二、项目目录

在这里插入图片描述

三、使用步骤

在终端定位到需要创建项目的目录输入npm init vite-app todoList
npm install less -D安装less
导入bootstrap
npm install axios安装axios

四、项目源码

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <link rel="icon" href="/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Vite App</title>
</head>
<body>
  <div id="app"></div>
  <script type="module" src="/src/main.js"></script>
</body>
</html>

main.js

import {
    createApp } from 'vue'
import App from './App.vue'
import './index.css'
//导入axios
import axios from 'axios'
//导入bootstrap
import '../src/assets/css/bootstrap.min.css'
const app = createApp(App)
//配置axios的默认访问地址
axios.defaults.baseURL = 'https://applet-base-api-t.itheima.net/'
//全局配置axios
app.config.globalProperties.$http = axios
app.mount('#app')