地方政府网站建设/网店seo是什么意思
目录
一、今日目标
1.生命周期
2.综合案例-小黑记账清单
3.工程化开发入门
4.综合案例-小兔仙首页
二、Vue生命周期
三、Vue生命周期钩子
四、生命周期钩子小案例
1.在created中发送数据
六、工程化开发模式和脚手架
1.开发Vue的两种方式
2.Vue CLI脚手架
基本介绍:
好处:
创建一个Vue项目的标准基础架子的步骤:
七、项目目录介绍和运行流程
1.项目目录介绍
2.运行流程
八、组件化开发
九、根组件 App.vue
1.根组件介绍
2.全部组件都由三部分构成
十、普通组件的注册使用-局部注册
1.特点:
2.步骤:
3.使用组件的方式:
4.注意:
5.案例
十一、普通组件的注册使用-全局注册
1.特点:
2.步骤
3.使用
4.注意
5.案例
十二、综合案例
1.小兔仙首页启动项目演示
2.小兔仙组件拆分示意图
3.开发思路
一、今日目标
1.生命周期
-
生命周期介绍
-
生命周期的四个阶段
-
生命周期钩子
-
声明周期案例
2.综合案例-小黑记账清单
-
列表渲染
-
添加/删除
-
饼图渲染
3.工程化开发入门
-
工程化开发和脚手架(之前都是引包开发)
-
项目运行流程
-
组件化
-
组件注册
4.综合案例-小兔仙首页
-
拆分模块-局部注册
-
结构样式完善
-
拆分组件 – 全局注册
二、Vue生命周期
思考:什么时候可以发送初始化渲染请求?(越早越好)什么时候可以开始操作dom?(至少dom得渲染出来)
-
初始化请求就是一进页面,就立即从后台拿数据,进行页面的渲染
-
当响应式数据创建好之后,才能发初始化渲染请求,才能对它修改和赋值
-
挂载完之后,才能操作dom
Vue生命周期:一个Vue实例从创建 到 销毁 的整个过程。
生命周期四个阶段:① 创建 ② 挂载 ③ 更新 ④ 销毁
1.在创建阶段:创建响应式数据,将data中的普通数据转换为响应式数据
2.在挂载阶段:基于提供的数据,渲染模板
3.在更新阶段:修改数据,更新视图
4.在销毁阶段:关闭浏览器就会,销毁Vue实例
三、Vue生命周期钩子
在Vue的生命周期过程中,会自动运行一些函数(生命周期函数),被称为【生命周期钩子】→ 让开发者可以在【特定阶段】运行自己的代码
Vue生命周期钩子函数写的位置和data配置项同级
重点看created和mounted函数
-
created函数:在创建响应式数据之后执行,这时可以开始发送初始化渲染请求
-
mounted函数:在模板渲染完成之后执行,在这一刻开始DOM才算渲染完成,才能操作DOM了
-
beforeDestroy函数:在Vue实例快销毁的时候执行一些操作
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><div id="app"><h3>{{ title }}</h3><div><button @click="count--">-</button><span>{{ count }}</span><button @click="count++">+</button></div></div><script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script><script>const app = new Vue({el: '#app',data: {count: 100,title: '计数器'},// 1. 创建阶段(准备数据)beforeCreate () {console.log('beforeCreate 响应式数据准备好之前', this.count)},created () {console.log('created 响应式数据准备好之后', this.count)// this.数据名 = 请求回来的数据// 可以开始发送初始化渲染的请求了},// 2. 挂载阶段(渲染模板)beforeMount () {console.log('beforeMount 模板渲染之前', document.querySelector('h3').innerHTML)},mounted () {console.log('mounted 模板渲染之后', document.querySelector('h3').innerHTML)// 可以开始操作dom了},// 3. 更新阶段(修改数据 → 更新视图)beforeUpdate () {console.log('beforeUpdate 数据修改了,视图还没更新', document.querySelector('span').innerHTML)},updated () {console.log('updated 数据修改了,视图已经更新', document.querySelector('span').innerHTML)},// 4. 卸载阶段beforeDestroy () {console.log('beforeDestroy, 卸载前')console.log('一般做的操作:清除掉一些Vue以外的资源占用,定时器,延时器...')},destroyed () {console.log('destroyed,卸载后')}})</script>
</body>
</html>
浏览器控制台的效果:
四、生命周期钩子小案例
1.在created中发送数据
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><style>* {margin: 0;padding: 0;list-style: none;}.news {display: flex;height: 120px;width: 600px;margin: 0 auto;padding: 20px 0;cursor: pointer;}.news .left {flex: 1;display: flex;flex-direction: column;justify-content: space-between;padding-right: 10px;}.news .left .title {font-size: 20px;}.news .left .info {color: #999999;}.news .left .info span {margin-right: 20px;}.news .right {width: 160px;height: 120px;}.news .right img {width: 100%;height: 100%;object-fit: cover;}</style>
</head>
<body><div id="app"><ul><li v-for="(item, index) in list" :key="item.id" class="news"><div class="left"><div class="title">{{ item.title }}</div><div class="info"><span>{{ item.source }}</span><span>{{ item.time }}</span></div></div><div class="right"><img :src="item.img" alt=""></div></li></ul></div><script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script><script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>// 接口地址:http://hmajax.itheima.net/api/news// 请求方式:getconst app = new Vue({el: '#app',data: {list: []},async created () {// 1. 发送请求获取数据const res = await axios.get('http://hmajax.itheima.net/api/news')// 2. 更新到 list 中,用于页面渲染 v-forthis.list = res.data.data}})</script>
</body>
</html>
六、工程化开发模式和脚手架
1.开发Vue的两种方式
-
核心包传统开发模式:基于html / css / js 文件,直接引入核心包,开发 Vue。
-
工程化开发模式:基于构建工具(例如:webpack)开发Vue。
工程化开发模式优点:
提高编码效率,比如使用JS新语法、Less/Sass、Typescript等通过webpack都可以编译成浏览器识别的ES3/ES5/CSS等
工程化开发模式问题:
-
webpack配置不简单
-
雷同的基础配置
-
缺乏统一的标准
为了解决以上问题,所以我们需要一个工具(Vue CLI),生成标准化的配置
2.Vue CLI脚手架
基本介绍:
Vue CLI 是Vue官方提供的一个全局命令工具
可以帮助我们快速创建一个Vue项目的标准基础架子,就是vue的项目目录。【集成了webpack配置】
好处:
-
开箱即用,零配置
-
内置babel等工具
-
标准化的webpack配置
创建一个Vue项目的标准基础架子的步骤:
-
全局安装Vue CLI(只需安装一次即可) yarn global add @vue/cli 或者 npm i @vue/cli -g
-
前面那个命令安装可能会报找不到命令错误,直接换后面那个命令安装就可以了
-
-
查看vue/cli版本,确认是否安装成功: vue --version
-
创建项目架子:vue create project-name(项目名不能使用中文)
-
在哪个目录下运行的这个命令,项目就创建在哪个目录下
-
-
运行项目:yarn serve 或者 npm run serve(命令不固定,看package.json文件中的scripts)
-
进入到vue项目的根目录,执行上述命令
-
七、项目目录介绍和运行流程
1.项目目录介绍
虽然脚手架中的文件有很多,目前咱们只需看下面标绿的三个文件和下面这四个即可
- node_modules:存放第三方依赖的
- public:存放html文件
- src:写代码的文件夹
- package.json:项目配置文件
-
index.html 模板文件
<!DOCTYPE html>
<html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1.0"><link rel="icon" href="<%= BASE_URL %>favicon.ico"><title><%= htmlWebpackPlugin.options.title %></title></head><body><!-- 用于兼容:给不支持js的浏览器一个提示 --><noscript><strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><!-- Vue所管理的容器,将来创建结构动态渲染这个容器 --><div id="app"><!-- 工程化开发模式中,这里不再直接编写模板语法,通过App.vue提供结构渲染 --><!-- 将来在App.vue中提供模板,提供结构 --></div><!-- built files will be auto injected --></body>
</html>
main.js 入口文件
//main.js文件的核心作用:导入App.vue,基于App.vue创建结构渲染index.html//1.导入vue核心包
import Vue from 'vue'
//2.导入App.vue根组件
import App from './App.vue'//在console中提示当前处于什么环境(生产环境/开发环境)
Vue.config.productionTip = false//3.实例化Vue,提供render方法,基于App.vue创建结构渲染index.html
new Vue({render: h => h(App),
}).$mount('#app') //$mount('选择器')作用和 el:'#app' 一样,用于指定Vue要管理的容器
App.vue App根组件
<template><div id="app"><img alt="Vue logo" src="./assets/logo.png"><HelloWorld msg="Welcome to Your Vue.js App"/></div>
</template><script>
import HelloWorld from './components/HelloWorld.vue'export default {name: 'App',components: {HelloWorld}
}
</script><style>
#app {font-family: Avenir, Helvetica, Arial, sans-serif;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-align: center;color: #2c3e50;margin-top: 60px;
}
</style>
所以整体的流程就是:基于App.vue来创建结构,最终渲染index.html里面的id属性为app的盒子
2.运行流程
八、组件化开发
组件化:可以将一个页面 拆分成 一个个的组件,每个组件都有自己独立的结构、样式、行为,在使用组件时,但组件使用的顺序来渲染。
好处:便于维护,利于复用 → 提升开发效率。
组件分类:普通组件、根组件。
- 根组件:整个应用最上层的组件,包裹所有普通小组件
比如:下面这个页面,可以把所有的代码都写在一个页面中,但是这样显得代码比较混乱,难易维护。咱们可以按模块进行组件划分
九、根组件 App.vue
1.根组件介绍
整个应用最上层的组件,包裹所有的普通小组件
2.全部组件都由三部分构成
-
语法高亮插件
三部分构成
-
template标签:结构 (有且只能一个根元素)
-
script标签: js逻辑
-
style标签: 样式 (可支持less,需要装包)
<template><!-- 这里面写HTML标签 -->
</template><script>
//export default中导出当前组件的配置项
//里面可以提供data methods computed watch 生命周期八大钩子函数
export default {}
</script><style><!-- 这里面写CSS样式 -->
</style>
-
让组件支持less
(1) style标签,lang="less" 开启less功能
(2) 装包: yarn add less less-loader -D 或者npm i less less-loader -D
十、普通组件的注册使用-局部注册
1.特点:
局部注册的组件 只能在注册的组件内使用
2.步骤:
-
先在components目录下,创建.vue组件(文件)(三个组成部分)
-
-
在要使用的组件内,先导入组件(在script标签中导入组件),再注册组件(在components配置项中注册组件),最后使用组件(注册组件的时候如果组件名和组件对象同名,则只用写组件名即可)
-
3.使用组件的方式:
和使用html标签一样:<组件名></组件名>
4.注意:
组件命名的规范 —> 大驼峰命名法, 如 HmHeader
5.案例
components目录下的HmHeader.vue文件:
<template><div class="hm-header">我是hm-header</div>
</template><script>
export default {}
</script><style>
.hm-header{height: 100px;line-height: 100px;text-align: center;font-size: 30px;background-color: rgb(196, 45, 207);color: white;
}
</style>
components目录下的HmMain.vue文件:
<template><div class="hm-main">我是hm-main</div></template><script>export default {}</script><style>.hm-main{height: 400px;line-height: 400px;text-align: center;font-size: 30px;background-color: coral;color: white;margin: 20px 0;}</style>
components目录下的HmFooter.vue文件:
<template><div class="hm-footer">我是hm-footer</div></template><script>export default {}</script><style>.hm-footer{height: 100px;line-height: 100px;text-align: center;font-size: 30px;background-color: rgb(20, 32, 211);color: white;}</style>
App.vue根组件:
<template><div class="App"><!-- 头部组件 --><HmHeader></HmHeader><!-- 主体组件 --><HmMain></HmMain><!-- 底部组件 --><HmFooter></HmFooter></div>
</template><script>
import HmHeader from './components/HmHeader.vue'
import HmMain from './components/HmMain.vue'
import HmFooter from './components/HmFooter.vue'
export default {components: {HmHeader: HmHeader,HmMain,HmFooter},
}
</script><style>
.App {width: 600px;height: 700px;background-color: #459cc8;margin: 0 auto;padding: 20px;
}
</style>
运行vue项目:
十一、普通组件的注册使用-全局注册
1.特点:
全局注册的组件,在项目的任何组件中都能使用。
通用的组件可以进行全局注册。
2.步骤
-
在components目录下,创建.vue组件(文件)(三个组成部分)
-
-
main.js中,全局注册组件
-
3.使用
当成HTML标签直接使用
<组件名></组件名>
4.注意
组件名规范 —> 大驼峰命名法, 如 HmHeader
5.案例
1.先在components目录下创建HmButton.vue组件(文件)
<template><button class="hm-button">通用按钮</button>
</template><script>
export default {}
</script><style>
.hm-button {height: 50px;line-height: 50px;padding: 0 20px;background-color: #3bae56;border-radius: 5px;
}
</style>
2.然后在main.js中进行全局注册
import Vue from 'vue'
import App from './App.vue'
import HmButton from './components/HmButton.vue'Vue.config.productionTip = false//全局注册组件
Vue.component('HmButton', HmButton)new Vue({render: h => h(App),
}).$mount('#app')
3.最后在要使用的组件里面使用
<template><div class="hm-main">我是hm-main<HmButton></HmButton></div></template><script>export default {}</script><style>.hm-main{height: 400px;line-height: 400px;text-align: center;font-size: 30px;background-color: coral;color: white;margin: 20px 0;}</style>
十二、综合案例
1.小兔仙首页启动项目演示
2.小兔仙组件拆分示意图
3.开发思路
-
分析页面,按模块拆分组件,如上图,搭架子 (局部或全局注册)
-
根据设计图,编写组件 html 结构 css 样式 (已准备好)
-
拆分封装通用的小组件 (局部或全局注册)
将来 → 通过 js 动态渲染,实现功能
相关文章:

Vue03
目录 一、今日目标 1.生命周期 2.综合案例-小黑记账清单 3.工程化开发入门 4.综合案例-小兔仙首页 二、Vue生命周期 三、Vue生命周期钩子 四、生命周期钩子小案例 1.在created中发送数据 六、工程化开发模式和脚手架 1.开发Vue的两种方式 2.Vue CLI脚手架 基本介绍…...

深入浅出:Gin框架路由与HTTP请求处理
深入浅出:Gin框架路由与HTTP请求处理 引言 在Web开发中,路由和HTTP请求处理是构建API的核心部分。Gin框架作为Go语言中最受欢迎的Web框架之一,提供了简洁而强大的工具来处理这些任务。本文将深入浅出地介绍如何使用Gin框架进行路由定义、处…...

C++初阶——模板初阶
目录 1、如何实现一个通用的交换函数 2、函数模板 2.1 函数模板的概念 2.2 函数模板的格式 2.3 函数模板的原理 2.4 函数模板的实例化 2.5 模板参数的匹配原则 3、类模板 3.1 类模板的格式 3.2 类模板的实例化 1、如何实现一个通用的交换函数 void Swap(int& lef…...

y3编辑器文档3:物体编辑器
文章目录 一、物体编辑器简介1.1 界面介绍1.2 复用(导入导出)1.3 收藏夹(项目资源管理)1.4 对象池二、单位2.1 数据设置2.2 表现设置2.3 单位势力和掉率设置2.4 技能添加和技能参数修改2.5 商店2.5.1 商店属性设置2.5.2 商店物品设置三、装饰物3.1 属性编辑3.2 碰撞体积四、…...

Linux-USB驱动实验
USB 是很常用的接口,目前大多数的设备都是 USB 接口的,比如鼠标、键盘、USB 摄像头等,我们在实际开发中也常常遇到 USB 接口的设备,本章我们就来学习一下如何使能 Linux内核自带的 USB 驱动。注意!本章并不讲解具体的 …...

【配置查询】.NET开源 ORM 框架 SqlSugar 系列
.NET开源 ORM 框架 SqlSugar 系列 【开篇】.NET开源 ORM 框架 SqlSugar 系列【入门必看】.NET开源 ORM 框架 SqlSugar 系列【实体配置】.NET开源 ORM 框架 SqlSugar 系列【Db First】.NET开源 ORM 框架 SqlSugar 系列【Code First】.NET开源 ORM 框架 SqlSugar 系列【数据事务…...

JavaWeb学习--cookie和session
目录 (一)Cookie概述 1.什么叫Cookie 2.Cookie规范 3.Cookie的覆盖 4.cookie的最大存活时间 (Cookie的生命) (二) Cookie的API 1.创建Cookie:new 构造方法 2.保存到客户端浏…...

Next.js系统性教学:动态路由与并行路由
更多有关Next.js教程,请查阅: 【目录】Next.js 独立开发系列教程-CSDN博客 目录 1. 动态路由 (Dynamic Routes) 1.1 动态路由的基础 1.2 获取动态参数 1.3 动态嵌套路由 1.4 捕获所有动态路由 2. 并行路由 (Parallel Routes) 2.1 并行路由的基础…...

Backblaze 2024 Q3硬盘故障质量报告解读
作为一家在2021年在美国纳斯达克上市的云端备份公司,Backblaze一直保持着对外定期发布HDD和SSD的故障率稳定性质量报告,给大家提供了一份真实应用场景下的稳定性分析参考数据: 以往报告解读系列参考: Backblaze发布2024 Q2硬盘故障…...

[创业之路-179]:《领先的密码 - BLM核心方法体系与企业实践》主要章节与主要内容
目录 前言: 1、引言或概述 2、BLM方法论的背景与起源 3、BLM方法论的发展与完善 4、BLM方法论的重要性与价值 5、本书的内容与结构 二、BLM核心方法体系 1. 领先的起点 2. 领先的战略 3. 领先的执行 4. 领先之魂 三、本书的核心思想 1、以战略为核心 …...

uniapp的生命周期
在 UniApp 中,生命周期函数是指在组件(如页面、视图等)创建和销毁过程中会自动触发的一些函数。UniApp 提供了多种生命周期函数,帮助开发者在适当的时机进行相关的逻辑处理。 UniApp 的生命周期函数可以分为 页面生命周期 和 组件…...

基于 RNN(GRU, LSTM)+CNN 的红点位置检测(pytorch)
文章目录 1 项目背景2 数据集3 思路4 实验结果5 代码 1 项目背景 需要在图片精确识别三跟红线所在的位置,并输出这三个像素的位置。 其中,每跟红线占据不止一个像素,并且像素颜色也并不是饱和度和亮度极高的红黑配色,每个红线放大…...

L2G3000-LMDeploy 量化部署实践
文章目录 LMDeploy 量化部署实践闯关任务环境配置W4A16 量化 KV cacheKV cache 量化Function call LMDeploy 量化部署实践闯关任务 环境配置 conda create -n lmdeploy python3.10 -y conda activate lmdeploy conda install pytorch2.1.2 torchvision0.16.2 torchaudio2.1.…...

verilog编程规范
verilog编程规范 文章目录 verilog编程规范前言一、代码划分二、verilog编码ABCDEFG 前言 高内聚,低耦合,干净清爽的代码 一、代码划分 高内聚: 一个功能一个模块干净的接口提取公共的代码 低耦合: 模块之间低耦合尽量用少量…...

飞飞5.4游戏源码(客户端+服务端+工具完整源代码+5.3fix+5.4patch+数据库可编译进游戏)
飞飞5.4游戏源码(客户端服务端工具完整源代码5.3fix5.4patch数据库可编译进游戏) 下载地址: 通过网盘分享的文件:【源码】飞飞5.4游戏源码(客户端服务端工具完整源代码5.3fix5.4patch数据库可编译进游戏) 链…...

【MySQL】——用一文领悟表的增删查改
目录 前言 🍃1.表的增加 🍙1.1增——insert 🍙1.2插入否则更新 🍤1.2.1影响行说明 🍂2.表的查询 🍘2.1查询——select 🍘2.2特殊表查询 🍥2.2.1添加表达式 🍥…...

Zabbix监控Oracle 19c数据库完整配置指南
Zabbix监控Oracle 19c数据库完整配置指南 本文将详细介绍如何使用Zabbix配置Oracle 19c数据库监控,包括安装、配置、问题排查等全过程。本指南适合新手独立完成配置。 1. 环境准备 1.1 系统要求 Oracle 19c数据库服务器Zabbix服务器(版本5.0或更高&a…...

静态路由与交换机配置实验
1.建立网络拓扑 添加2台计算机,标签名为PC0、PC1;添加2台二层交换机2960,标签名为S0、S1;添加2台路由器2811,标签名为R0、R1;交换机划分的VLAN及端口根据如下拓扑图,使用直通线、DCE串口线连接…...

【jvm】讲讲jvm中的gc
目录 1. 说明2. 主要算法2.1 标记-清除算法2.2 复制算法2.3 标记-整理算法3. 主要回收器3.1 Serial GC3.2 Parallel GC3.3 CMS(Concurrent Mark-Sweep)GC3.4 G1(Garbage-First)GC 4. 触发条件4.1 Minor GC(Young GC&am…...

openlayers地图事件
OpenLayers是一个开源的JavaScript库,用于在Web上创建交互式地图。它提供了许多地图事件,使用户可以与地图进行交互。以下是OpenLayers常用的地图事件: 1. click:当用户单击地图时触发该事件。 2. dblclick:当用户双…...

杂记9---一些场景git操作汇总
背景:不同项目需求,所需要git操作集合,不太一样,这里汇总记录一下。 场景1:给本地项目添加到远程仓库的新建分支上 把本地节点保存在自己库的一个分支: git init git remote add origin xxx.git 远程仓库…...

Mysql索引,聚簇索引,非聚簇索引,回表查询
什么是索引 数据库索引是为了实现高效数据查询的一种有序的数据数据结构,类似于书的目录,通过目录可以快速的定位到想要的数据,因为一张表中的数据会有很多,如果直接去表中检索数据效率会很低,所以需要为表中的数据建立…...

【优选算法 二分查找】二分查找算法入门详解:二分查找小专题
x 的平方根 题目解析 算法原理 解法一: 暴力解法 如果要求一个数(x)的平方根,可以从 0 往后枚举,直到有一个数(a),a^2<x,(a1)^2>x,a即为所求; 解法二:二分查找 …...

如何将CSDN博客下载为PDF文件
1.打开CSDN文章内容 2.按键盘上的f12键(或者右键—审查元素)进入浏览器调试模式,点击控制台(Console)进入控制台 3.在控制台输入以下代码,回车 4.在弹出的打印页面中将布局设置成横向,纵向会…...

pdf转word/markdown等格式——MinerU的部署:2024最新的智能数据提取工具
一、简介 MinerU是开源、高质量的数据提取工具,支持多源数据、深度挖掘、自定义规则、快速提取等。含数据采集、处理、存储模块及用户界面,适用于学术、商业、金融、法律等多领域,提高数据获取效率。一站式、开源、高质量的数据提取工具&…...

2024年下半年网络工程师案例分析真题及答案解析
2024年下半年网络工程师案例分析真题及答案解析 试题一(15分) [说明] 公司为某科技园区的不同企业提供网络服务,不同企业的业务有所不同,每个企业因业务需要在不同的地点有多个分支机构。其拓扑结构如图1所示。企业用户通过楼层接入交换机、楼栋汇聚交换机和区域交换机接…...

English phonetic symbol
英语音标发音表-英语48个音标在线读 (jiwake.com) 【英语音标教程】从此学会国际音标|英式音标|BBC音标教程全解_哔哩哔哩_bilibili 元音 单元音 /iː/,/ɪ/ 这两个音不是发音长短的区别, /uː/ /ʊ/ 上面那个就正常读,下面那个她的气大概是往你斜…...

普及组集训--图论最短路径设分层图
P4568 [JLOI2011] 飞行路线 - 洛谷 | 计算机科学教育新生态 可以设置分层图:(伪代码) E(u,v)w;无向图 add(u,v,w),add(v,u,w); for(j1~k){add(ujn,vjn,w);add(vjn,ujn,w);add(ujn-j,vjn-j,0);add(vjn-j,ujn-j,0); } add(ujn-j,vjn-j,0); add(vjn-j,uj…...

SYN6288语音合成模块使用说明(MicroPython、STM32、Arduino)
模块介绍 SYN6288中文语音合成模块是北京宇音天下科技有限公司推出的语音合成模块。该模块通过串口接收主控传来的语音编码后,可自动进行自然流畅的中文语音播报。 注:SYN6288模块无法播报英文单词和句子,只能按字母播报英文 ;而…...

Spring完整知识三(完结)
Spring集成MyBatis 注意 Spring注解形式集成MyBatis时,若SQL语句比较复杂则仍采用映射文件形式书写SQL语句;反之则用注解形式书写SQL语句,具体可详见Spring注解形式 环境准备相同步骤 Step1: 导入相关坐标,完整pom.…...