当前位置：首页 > news >正文

Vue03

news 来源：原创 2025/1/17 22:58:04

一、今日目标

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
1. 前面那个命令安装可能会报找不到命令错误，直接换后面那个命令安装就可以了
查看vue/cli版本，确认是否安装成功： vue --version
创建项目架子：vue create project-name(项目名不能使用中文)
1. 在哪个目录下运行的这个命令，项目就创建在哪个目录下
运行项目：yarn serve 或者 npm run serve(命令不固定，看package.json文件中的scripts)
1. 进入到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脚手架基本介绍…...

编程日记 2025/1/17 22:58:04

【AI学习】Mamba学习（十九）：关于S4-FouT

在前面《Mamba学习（十六）：从S4到S5模型》一文中，提到了S4D-Lin，其具体状态矩阵A的初始化形式为： S4D-Lin对比S4D-Inv是一种更简单的形式，可以看作是对S4-FouT（S4的另外一种变体&am…...

编程日记 2025/1/17 1:57:57

YOLOv5-C3模块实现

YOLOv5-C3模块实现 🍨 本文为🔗365天深度学习训练营中的学习记录博客 🍖 原作者：K同学啊电脑系统：Windows11 显卡型号：NVIDIA Quadro P620 语言环境：python 3.9.7 编译器：jupyt…...

编程日记 2025/1/14 19:07:41

ubuntu下Qt5自动编译配置QtMqtt环境（10）

文章目录 [toc]1、概述2、下载QtMqtt源码3、编译4、验证5、参考6、视频更多精彩内容👉内容导航 👈👉Qt网络编程 👈 1、概述 Qt默认是不包含mqtt库的，如果需要使用到mqtt库就只能自己编译配置； 网络所有的…...

编程日记 2025/1/13 9:49:09

切比雪夫不等式：方差约束下的概率估计

切比雪夫不等式：方差约束下的概率估计背景在概率分析中，切比雪夫不等式是一个常用的工具，它通过引入随机变量的方差信息，给出了偏离均值的概率界限。这一不等式是对马尔科夫不等式的自然扩展，结合了更丰富的分布…...

编程日记 2025/1/16 1:45:38

SIP系列七：ICE框架（P2P通话）

我的音视频/流媒体开源项目(github) SIP系列目录目录一、NAT 1、NAT介绍 2、NAT类型 2.1、完全圆锥型NAT 2.2、受限圆锥型NAT 2.3、端口受限圆锥型NAT 2.4、对称NAT 3、NAT打洞 3.1、不同一NAT下 3.2、同一NAT下二、ICE 三、ICE中的SDP 至此&#x…...

编程日记 2025/1/17 6:22:05

小程序-基于java+SpringBoot+Vue的智慧校园管理系统设计与实现

项目运行 1.运行环境：最好是java jdk 1.8，我们在这个平台上运行的。其他版本理论上也可以。 2.IDE环境：IDEA，Eclipse,Myeclipse都可以。推荐IDEA; 3.tomcat环境：Tomcat 7.x,8.x,9.x版本均可 4.硬件环境&#xff1a…...

编程日记 2025/1/13 17:04:04

Visual Studio 2022创建离线安装包

步骤1： 下载 Visual Studio 引导程序(最新版) 历史版本步骤2 新建文件夹“E:\VS2022”，将下载的“vs_Professional.exe”拷贝到文件夹下在此文件夹窗口按住shift鼠标右键，选择“在此处打开powershell窗口” 步骤3 根据需要将代码复制到…...

编程日记 2025/1/13 0:57:33

Android 实现中英文切换

在开发海外项目的时候，需要实现app内部的中英文切换功能，所有的英文都是内置的，整体思路为： 创建一个sp对象，存储当前系统的语言类型，然后在BaseActivity中对语言进行判断； //公共Activitypubl…...

编程日记 2025/1/13 0:11:09

CmakeLists学习刨根问底

必要的两项内容 cmake_minimum_required(VERSION 2.5)project(mymuduo) 这行代码指定了构建项目所需的CMake最低版本为2.5。CMake是一个跨平台的自动化构建系统，它使用CMakeLists.txt文件来定义项目的构建过程。定义项目的名称为mymuduo。CMake将使用这个名称来生成…...

编程日记 2025/1/14 6:21:35

策略模式实战 - 猜拳游戏

**可以整体的替换一套算法，这就是策略模式。**这样对于同一个问题，可以有多种解决方案——算法实现的时候，可以通过策略模式来非常方便的进行算法的整体替换，而各种算法是独立封装好的，不用修改其内部逻辑。具体的实…...

编程日记 2025/1/15 2:01:57

VoCo-LLaMA: Towards Vision Compression with Large Language Models

视觉语言模型在各种多模态任务上取得了显著的成功，但经常受到有限上下文窗口和处理高分辨率图像输入和视频的高计算成本的瓶颈。视觉压缩可以通过减少视觉令牌数量避免该问题。先前方法使用额外模块压缩视觉令牌并强制LLM理解压缩的令牌。然而，LLM对视觉…...

编程日记 2025/1/15 3:30:10

每日小知识

Kafka是一个分布式流平台，具有高性能、高可靠性和可扩展性的特点。它主要用于处理实时的数据流，将数据以高吞吐量的方式进行发布和订阅。以下是关于Kafka的几个基本概念和优势的介绍： 概念： 生产者（Producer&#xf…...

编程日记 2025/1/13 16:31:12

Linux其二设置端口号，静态ip以及命令

目录 1、VI编辑器【linux版本的文本文件】 2） 补充的vi编辑器的其他内容(了解) 2、ln 连接的意思 link的缩写 3、文件的查看【重点】 4、压缩与解压（重点） 5、find 查找命令 6、which & whereis 作用是一样的，表示某…...

编程日记 2025/1/16 0:17:18

吉林大学23级数据结构上机实验（第7周）

A 去火车站寒假到了，小明准备坐火车回老家，现在他从学校出发去火车站，CC市去火车站有两种方式：轻轨和公交车。小明为了省钱，准备主要以乘坐公交为主。CC市还有一项优惠政策，持学生证可以免费乘坐一站轻轨&…...

编程日记 2025/1/13 0:57:36

SpringBoot（整合MyBatis + MyBatis-Plus + MyBatisX插件使用）

文章目录 1.整合MyBatis 1.需求分析2.数据库表设计3.数据库环境配置 1.新建maven项目2.pom.xml 引入依赖3.application.yml 配置数据源4.Application.java 编写启动类5.测试6.配置类切换druid数据源7.测试数据源是否成功切换 4.Mybatis基础配置 1.编写映射表的bean2.MonsterMap…...

编程日记 2025/1/13 13:49:47

【2024最新】基于Springboot+Vue的网上图书商城平台Lw+PPT

作者：计算机搬砖家开发技术：SpringBoot、php、Python、小程序、SSM、Vue、MySQL、JSP、ElementUI等，“文末源码”。专栏推荐：SpringBoot项目源码、Vue项目源码、SSM项目源码、微信小程序源码精品专栏：Java精选实战项…...

编程日记 2025/1/17 3:16:51

JAVA-面向对象基础

文章目录概要封装多态抽象类接口内部类为什么需要内部类概要面向对象是一种编程范式或设计哲学，它将软件系统设计为由多个对象组成，这些对象通过特定的方式相互作用封装将数据和操作数据的方法封装在一个类中，并通过访问修饰符控制对…...

编程日记 2025/1/15 9:16:02

Y3编辑器官方文档1：编辑器简介及菜单栏详解（文件、编辑、窗口、细节、调试）

文章目录一、新建项目二、编辑器主界面2.1 游戏场景2.2 导航栏/菜单栏2.3 功能栏三、菜单栏详细介绍3.1 文件3.1.1 版本管理3.1.2 项目管理(多关卡)3.1.2.1 多关卡功能说明3.1.2.2 关卡切换与关卡存档3.2 编辑3.2.1 通用设置3.2.2 键位设置3.3 窗口（日志）3.4 细节3.4.1 语言…...

编程日记 2025/1/17 7:08:54

力扣94题：二叉树的中序遍历

力扣94题：二叉树的中序遍历（C语言实现详解） 题目描述给定一个二叉树的根节点 root ，返回它的中序遍历（Inorder Traversal）。中序遍历的规则是： 先访问左子树；再访问根节点&…...

编程日记 2025/1/15 5:08:47

【数据结构】二叉树的性质和存储结构

性质在二叉树的第i层上至多有2^{i-1}个结点,至少有1个结点深度为k的二叉树至多有2^{k-1}个结点（k≥1），至少有k个结点对任何一棵二叉树T，如果其叶子数为n0，度为2的结点数为n2，则n0n21 具有n个结点的完…...

编程日记 2025/1/14 14:50:13

【Spring项目】图书管理系统

阿华代码，不是逆风，就是我疯你们的点赞收藏是我前进最大的动力！！ 希望本文内容能够帮助到你！！ 目录一：项目实现准备 1：需求 （1）登录 2：准备…...

编程日记 2025/1/14 3:17:21

TCP编程案例

笔记：（本题可能需要的） TCP协议： TCP协议进行通信的两个应用进程：客户端、服务端。使用TCP协议前，须先建立TCP连接，形成基于字节流的传输数据通道传输前，采用“三次握手”方式…...

编程日记 2025/1/13 0:59:32

PyTorch 实现动态输入

使用 PyTorch 实现动态输入：支持训练和推理输入维度不一致的 CNN 和 LSTM/GRU 模型在深度学习中，处理不同大小的输入数据是一个常见的挑战。许多实际应用需要模型能够灵活地处理可变长度的输入。本文将介绍如何使用 PyTorch 实现支持动态输入的 CNN 和…...

编程日记 2025/1/12 23:59:38

网络数据库

创建删除修改模式create schemadrop schema表create tabledrop tablealter table视图create view drop view索引create indexdrop index alter index 定义模式：create schema 《模式名》 authorization 《用户名》表定义语句视图定义语句授权定义语句//未指…...

编程日记 2025/1/16 6:12:17

【软考速通笔记】系统架构设计师⑲——专业英语

文章目录一、前言二、常用名词三、架构风格四、非功能需求五、应用架构六、软件架构重用一、前言笔记目录大纲请查阅：【软考速通笔记】系统架构设计师——导读二、常用名词名词翻译architecture架构system系统design设计requirements需求components组件constr…...

编程日记 2025/1/14 17:34:23

Android APP自学笔记

摘抄于大学期间记录在QQ空间的一篇自学笔记，当前清理空间，本来想直接删除掉的，但是感觉有些舍不得，因此先搬移过来。 Android导入已有外部数据库 2015.06.26在QQ空间记录：在Android中不能直接打开res aw目录中的数据…...

编程日记 2025/1/16 2:16:50

Spring 事务和事务传播机制

Spring 事务和事务传播机制一、Spring 事务的基本概念事务是一组操作，被视为一个不可分割的工作单元，要么全部完成，要么全部失败回滚，以此来确保数据的一致性和完整性。Spring事务管理允许我们在应用程序中声明式地或编程式地…...

编程日记 2025/1/13 0:13:00

VSCode（四）CMake调试

1. 工具准备 1.1 C环境插件 1.2 CMake插件 2. Cmake工程 2.1 创建项目文件夹 ex:CMAKE_TEST 2.2 创建CMake工程 （shift ctl P), 选择"CMAKE: Quick Start": 2.3 填写project name: (ex: test_cmake) 2.4 选择”Executable“ 项目文件内会自动…...

编程日记 2025/1/16 4:38:48

创建存储过程

在student数据库中，创建一个名为ST_CHAXUN_01的存储过程，该存储过程返回计算机系学生的“姓名”、“性别”、“出生日期”信息。操作步骤如下： ① 在“对象资源管理器”窗格中，展开“数据库”结点。 ② 单击相应的数据库&#…...

编程日记 2025/1/13 0:55:49

macOS 15.1.1 (24B2091) 系统中快捷键符号及其代表的按键的对照表

以下是 macOS 15.1.1 (24B2091) 系统中快捷键符号及其代表的按键的对照表： 符号按键名称描述⌘Command (Cmd)常用的功能键，用于执行大多数快捷操作。⌥Option (Alt)Option 键，常用于辅助操作和特殊字符输入。⇧ShiftShift 键，常用…...

编程日记 2025/1/15 3:44:42

ftp服务器搭建-安装、配置及验证 #安装 sudo apt-get install vsftpd #配置文件 cat > /etc/vsftpd.conf << "EOF" listenNO listen_ipv6YES anonymous_enableNO local_enableYES write_enableYES dirmessage_enableYES use_localtimeYES xferlog_enable…...

编程日记 2025/1/12 14:14:50

windows ping 执行过程分析

控制台 PS C:\Users\Admin> ping mcs.zijieapi.com正在 Ping mcs.zijieapi.com [223.109.117.226] 具有 32 字节的数据: 来自 223.109.117.226 的回复: 字节32 时间31ms TTL49 来自 223.109.117.226 的回复: 字节32 时间30ms TTL49 来自 223.109.117.226 的回复: 字节32 时…...

编程日记 2025/1/14 2:22:52

强大的远程同步工具-rsync

rsync 强大的远程同步工具，也可用于本地目录和本地目录的同步，它最大的特点就是会自动判断进行增量同步； # “演示文档”后加了/，代表传输的是文件，建议destination也指定一个目录，该目录可以不存在&…...

编程日记 2025/1/14 3:22:29

蝉联第一 | IDC云系统软件市场报告2024H1，云轴科技ZStack独立云厂商第一

2024年12月，根据全球知名的IT市场研究和咨询公司IDC最新发布的《中国云系统软件市场跟踪报告2024H1》显示，2024年上半年中国云系统软件市场规模达到27.93亿元人民币，同比增长11.6%。在这一增长趋势中，云轴科技ZStack作为云系统软件…...

编程日记 2025/1/17 21:25:50

【IPV6改造解读】

座右铭：我们每一个心怀希望的人，就像是一颗种子一样！ 文章目录前言一、IPV6改造基本情况分析二、IPV6针对不同场景改造方案1.网站/APP场景-IPV6云网关升级改造方案2.局域网专网(互联网侧)场景-安全大脑IPV6改造方案总结前言提示&#xf…...

编程日记 2025/1/16 22:37:37

常用的Kali命令Top10

Kali Linux是一种基于Debian的Linux发行版，被广泛用于渗透测试和网络安全。以下是一些常用的Kali Linux命令的详细解释： ifconfig：显示和配置网络接口的信息。可以用于查看当前系统的IP地址、网关和子网掩码等。 apt-get：用于安装…...

编程日记 2025/1/17 22:37:12

阿里巴巴正式发布了全新大型语言模型Marco-o1

每周跟踪AI热点新闻动向和震撼发展想要探索生成式人工智能的前沿进展吗？订阅我们的简报，深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同，从行业内部的深度分析和实用指南中受益。不要错过这个机会，成为AI领…...

编程日记 2025/1/14 3:36:53

【AI日记】24.12.07 kaggle 比赛 Titanic-10

【AI论文解读】【AI知识点】【AI小项目】【AI战略思考】【AI日记】工作内容： 学习 kaggle 入门比赛 Titanic - Machine Learning from Disaster学习机器学习（pandas，numpy，sklearn，seaborn，matplotlib&a…...

编程日记 2025/1/14 4:28:31

《QT 示例宝库：探索丰富的编程世界》

《QT 示例宝库：探索丰富的编程世界》一、QT 基础示例（一）QRadioButton 示例（二）拦截关闭事件示例二、QT 常用代码示例（一）QObject 相关操作（二）Qt 基本容器遍历&#x…...

编程日记 2025/1/16 0:11:48

子类有多个父类的情况下Super不支持指定父类来调用方法

1、Super使用方法 super()函数在Python中用于调用父类的方法。它返回一个代理对象，可以通过该对象调用父类的方法。要使用super()方法，需要在子类的方法中调用super()，并指定子类本身以及方法的名称。这样就可以在子类中调用父类的方法。 …...

编程日记 2025/1/17 20:28:52

鸿蒙UI开发——渐变色效果

1、概述 ArkTs可以通过颜色渐变接口，设置组件的背景颜色渐变效果，实现在两个或多个指定的颜色之间进行平稳的过渡。目前提供三种渐变类型：线性渐变、角度渐变、径向渐变。我们在鸿蒙UI布局实战 —— 个人中心页面开发中，默认…...

编程日记 2025/1/16 20:46:51

java基础概念47-ArrayList、LinkList和迭代器

一、ArrayList集合 1-1、ArrayList的两种添加信息的方式 1-2、ArrayList集合底层逻辑 1、利用空参创建的集合，在底层创建一个默认长度为0的数组 2、添加第一个元素时，底层会创建一个新的长度为10的数组 3、存满时，会扩容1.5倍。 4、如果…...

编程日记 2025/1/14 6:46:06

java编程1.5.4 - 失而复得

前言通过实践而发现真理，又通过实践而证实真理和发展真理。从感性认识而能动地发展到理性认识，又从理性认识而能动地指导革命实践，改造主观世界和客观世界。实践、认识、再实践、再认识，这种形式，循环往复以至无穷&a…...

编程日记 2025/1/15 11:29:00

R语言使用“纽约市数据集中的优步皮卡”数据创建不同年度时间范围的可视化

一、项目背景为了分析纽约市优步（https://baike.baidu.com/item/Uber/14900884）皮卡在不同年度的使用情况，需要利用R语言进行数据可视化。通过对比不同年度的数据，可以揭示出优步皮卡使用的趋势和变化。二、数据准备数据集&a…...

编程日记 2025/1/15 13:10:19

韩企研学团造访图为科技：共探人工智能创新前沿

今日，一支由韩国知名企业研学专家组成的代表团莅临图为科技深圳总部，展开了一场深度技术交流与研讨活动。此次访问旨在通过实地探访中国领先的科技企业，促进中韩两国在科技创新领域的深入合作与交流。韩国游学团合影图为科技作为一家在人…...

编程日记 2025/1/14 0:20:40

Windows设备go环境安装配置

一、下载go安装包官网链接：All releases - The Go Programming Language (google.cn) 安装过程比较简单，这里不再赘述，可参考这位博主的文章。本文重点在环境配置。golang环境详细安装、配置_golang安装-CSDN博客二、环境变量配置 1.添…...

编程日记 2025/1/12 23:33:22

THREE.js 入门（一）xyz坐标系

一、坐标系概念在 three.js 中，相机的默认朝向是沿着 Z 轴的负方向。也就是说，默认情况下，相机会沿着 Z 轴的负方向“看”到场景中的对象，而 X 轴和 Y 轴分别对应水平方向和垂直方向。换句话说，相机的默认位置是 (0,…...

编程日记 2025/1/13 0:00:07

Android仿美团左右联动购物列表

Android仿美团左右联动购物列表左右联动购物列表，不难。一、思路： 两个RecycleView 二、效果图： 三、关键代码： public class MainActivity extends AppCompatActivity {private RecyclerView rl_left;private RecyclerVie…...

编程日记 2025/1/13 0:56:02