HarmonyOS Next 组件或页面之间的所有通信(传参)方法总结

系列文章目录

【鸿蒙】HarmonyOS NEXT开发快速入门教程之ArkTS语法装饰器(上)
【鸿蒙】HarmonyOS NEXT开发快速入门教程之ArkTS语法装饰器(下)
【鸿蒙】HarmonyOS NEXT应用开发快速入门教程之布局篇(上)
【鸿蒙】HarmonyOS NEXT应用开发快速入门教程之布局篇(下)


HarmonyOS Next 系列之省市区弹窗选择器实现(一)
HarmonyOS Next 系列之验证码输入组件实现(二)
HarmonyOS Next 系列之底部标签栏TabBar实现(三)
HarmonyOS Next 系列之HTTP请求封装和Token持久化存储(四)
HarmonyOS Next 系列之从手机选择图片或拍照上传功能实现(五)
HarmonyOS Next 系列之可移动悬浮按钮实现(六)
HarmonyOS Next 系列之沉浸式状态实现的多种方式(七)
HarmonyOS Next系列之Echarts图表组件(折线图、柱状图、饼图等)实现(八)
HarmonyOS Next系列之地图组件(Map Kit)使用(九)
HarmonyOS Next系列之半圆环进度条实现(十)
HarmonyOS Next 系列之列表下拉刷新和触底加载更多数据实现(十一)
HarmonyOS Next系列之实现一个左右露出中间大两边小带缩放动画的轮播图(十二)
HarmonyOS Next系列之水波纹动画特效实现(十三)


文章目录

  • 系列文章目录
  • 前言
  • 一、父子组件参数传递
    • 1、父传子
      • 方法一:@Prop
      • 方法二:@Link
      • 方法三:普通变量
      • 三种方法区别
        • 示例1:
        • 示例2:
      • 方法四:@Provide+@Consume
      • 方法五:@LocalStorageProp或@LocalStorageLink
      • 方法六:@StorageProp和@StorageLink
      • 方法七:eventHub
      • 方法八:globalThis
    • 2、子传父
  • 二、爷孙组件参数传递
    • 方法一:@Provide和@Consume
      • 方法二:@LocalStorageProp或@LocalStorageLink
      • 方法三:@StorageProp和@StorageLink
      • 方法四:eventHub
      • 方法五:globalThis
  • 三、兄弟组件参数传递
    • 方法一:@Provide和@Consume
    • 方法二:@Prop和事件回调函数
    • 方法三:@LocalStorageProp或@LocalStorageLink
      • 方法四:@StorageProp和@StorageLink
      • 方法五:eventHub
      • 方法六:globalThis
  • 三、不同页面组件间数据传递
    • 方法一:@StorageProp和@StorageLink
    • 方法二:eventHub
    • 方法三:globalThis
  • 四、父组件调用子组件内部方法
  • 四、子组件调用父组件内部方法
  • 五、路由跳转和传参


前言

本文总结了鸿蒙中常用的组件或页面之间参数传递方法,包括父子组件,子孙组件,兄弟组件,互不相关的组件(页面)和页面路由跳转的参数传递以及父子组件方法互调等。


一、父子组件参数传递

1、父传子

方法一:@Prop

说明:子组件定义@Prop变量,父组件通过对象形式传入数据

示例:

@Entry
/*** 父组件*/
@Component
struct Parent {@State title:string='鸿蒙系统'build() {Column() {Child({title:this.title})}.width('100%').height('100%')}
}/*** 子组件*/
@Component
struct Child {@Prop title:string;build() {Text(`我是子组件标题:${this.title}`)}
}

运行效果:

在这里插入图片描述

方法二:@Link

说明:子组件定义@Link变量,父组件通过对象形式传入数据

@Entry
/*** 父组件*/
@Component
struct Parent {@State title:string='鸿蒙系统'build() {Column() {Child({title:this.title})}.width('100%').height('100%')}
}/*** 子组件*/
@Component
struct Child {@Link title:string;build() {Button(this.title)}
}

运行效果:
在这里插入图片描述

方法三:普通变量

说明:子组件定义普通变量,父组件通过对象形式传入数据

@Entry
/*** 父组件*/
@Component
struct Parent {@State title:string='普通变量'build() {Column() {Child({title:this.title})}.width('100%').height('100%')}
}/*** 子组件*/
@Component
struct Child {private title:string='';build() {Text(`我是${this.title}`)}
}

运行结果:
在这里插入图片描述

三种方法区别

1、@Prop数据为单向传递,只能从父组件传递到子组件,无法从子组件回传到父组件。也就是子组件被@Prop修饰的变量值改变后,对应的父组件数据不变。
2、@Link数据为双向绑定,子组件被@Link修饰的变量值改变,对应的父组件的数据也跟着变化,而且具有UI响应变化
3、普通变量只在子组件初始化时候能拿到父组件传递的数据,后续如果父组件改变值子组件将无法获取到最新值

示例1:

通过改变父组件值看看对应子组件数据变化情况

@Entry
/*** 父组件*/
@Component
struct Parent {@State prop:string='prop方式'@State link:string='link方式'@State common:string="普通方式"build() {Column({space:10}) {Child({prop:this.prop})Child2({link:this.link})Child3({common:this.common})Button('父组件改变值').onClick(()=>{this.prop='父组件改变后的prop'this.link='父组件改变后的link'this.common='父组件改变后的普通方式'})}.width('100%').height('100%')}
}/*** 子组件*/
@Component
struct Child {@Prop prop:string;build() {Row(){Text(`我是子组件prop变量,值为:${this.prop}`).fontColor(Color.Red)}}
}
/*** 子组件*/
@Component
struct Child2 {@Link link:string;build() {Row(){Text(`我是子组件link变量,值为:${this.link}`).fontColor(Color.Red)}}
}
/*** 子组件*/
@Component
struct Child3 {private common?:string='';build() {Row(){Text(`我是子组件普通变量,值为:${this.common}`).fontColor(Color.Red)}}
}

运行效果:

请添加图片描述
说明:从运行结果可以看出普通变量方式只能在首次拿到数据后续无法响应UI变化,而@Prop和@Link可以。

示例2:

通过改变子组件值看看父组件数据变化情况

@Entry
/*** 父组件*/
@Component
struct Parent {@State prop:string='prop方式'@State link:string='link方式'@State common:string="普通方式"build() {Column({space:10}) {Text(`父组件prop值为:${this.prop}`)Text(`父组件link值为:${this.link}`)Text(`父组件common值为:${this.common}`)Child({prop:this.prop})Child2({link:this.link})Child3({common:this.common})}.width('100%').height('100%')}
}/*** 子组件*/
@Component
struct Child {@Prop prop:string;build() {Row(){Button('改变子组件prop值').onClick(()=>{this.prop="新prop"})}}
}
/*** 子组件*/
@Component
struct Child2 {@Link link:string;build() {Row(){Button('改变子组件link值').onClick(()=>{this.link="新link"})}}
}
/*** 子组件*/
@Component
struct Child3 {private  common?:string='';build() {Row(){Button('改变子组件common值').onClick(()=>{this.common="新common"})}}
}

运行效果:
在这里插入图片描述
说明:从运行效果可以看出@Link绑定的变量改变同时父组件数据跟着变,另两个父组件数据不受影响。


方法四:@Provide+@Consume

见下文介绍


方法五:@LocalStorageProp或@LocalStorageLink

见下文介绍


方法六:@StorageProp和@StorageLink

见下文介绍


方法七:eventHub

见下文介绍


方法八:globalThis

见下文介绍


2、子传父

子传父需求场景一般都是一些事件参数传递,如点击事件回调等

方法:父组件传递一个函数参数给子组件,子组件调用函数并传入入参,父组件就可以拿到该入参

示例:

@Entry/*** 父组件*/
@Component
struct Parent {@State name: string = ''build() {Column({ space: 10 }) {Text(`姓名是:${this.name}`)Child({clickAction: (name) => {this.name = name}})}.width('100%').height('100%')}
}/*** 子组件*/
@Component
struct Child {//回调函数private clickAction: (name: string) => void = () => {}build() {Row() {Button('获取姓名').onClick(() => {this.clickAction('小明')})}}
}

运行效果:
请添加图片描述

二、爷孙组件参数传递

方法一:@Provide和@Consume

说明@Provide和@Consume组合可以把参数往子孙层传递,不单单支持爷孙组件之间,支持跨层级(多层级、不限层级)传递。
并且数据是双向绑定的和@Link一样,改变孙子组件数据,爷爷组件数据也会跟着变化

ps:所以@Provide和@Consume也支持父子组件参数传递,但其更多用在跨层级组件之间数据传递,父子组件优先使用上面介绍前三种。

示例:

//父组件
@Entry
@Component
struct Parent {@Provide('weight') weight: number = 50build() {Column({ space: 20 }) {Text(`爷组件体重值:${this.weight}`)Button(`爷组件件体重+1`).onClick(() => {this.weight++})Child()}.padding(20).alignItems(HorizontalAlign.Start)}
}//子组件
@Component
struct Child {build() {Grandson()}
}//孙组件
@Component
struct Grandson {@Consume('weight') weight: numberbuild() {Column({ space: 20 }) {Text(`孙组件体重值:${this.weight}`)Button(`孙组件体重+1`).onClick(() => {this.weight++})}.margin({ top: 50 })}
}

运行效果:
请添加图片描述

方法二:@LocalStorageProp或@LocalStorageLink

见下文介绍


方法三:@StorageProp和@StorageLink

见下文介绍


方法四:eventHub

见下文介绍


方法五:globalThis

见下文介绍


三、兄弟组件参数传递

方法一:@Provide和@Consume

利用@Provide和@Consume数据双向绑定特性,以公共的父组件为中间媒介传递数据

示例代码:

//父组件
@Entry
@Component
struct Index {//姓名@Provide('name') name: string ='张三'build() {Column({ space: 20 }) {Child()Child2()}}
}//子组件1
@Component
struct Child {@Consume('name') name: stringbuild() {Column({ space: 20 }) {Text(`姓名为${this.name}`)}}
}//子组件2
@Component
struct Child2 {@Consume('name') name: stringbuild() {Column({ space: 20 }) {Button('改变姓名').onClick(()=>{this.name='李四'})}}
}

运行效果:
请添加图片描述

方法二:@Prop和事件回调函数

利用父组件为中间媒介,数据先从子组件1传递到父组件,在从父组件传给组件2

示例:

//父组件
@Entry
@Component
struct Index {//姓名@State name: string ='张三'build() {Column({ space: 20 }) {Child({name:this.name})Child2({changeAction:(name:string)=>{this.name=name}})}}
}//子组件1
@Component
struct Child {@Prop name: stringbuild() {Column({ space: 20 }) {Text(`姓名为${this.name}`)}}
}//子组件2
@Component
struct Child2 {//回调函数private changeAction:(name:string)=>void=()=>{}build() {Column({ space: 20 }) {Button('改变姓名').onClick(()=>{this.changeAction('李四')})}}
}

运行效果:和方法一:@Provide和@Consume示例一样效果

方法三:@LocalStorageProp或@LocalStorageLink

@LocalStorageProp和@LocalStorageLink是页面级的UI状态存储,页面内的所有组件共享一份存储数据

示例:

let storage: LocalStorage = new LocalStorage();
storage.setOrCreate('name','张三')//父组件
@Entry(storage)
@Component
struct Index {build() {Column({ space: 20 }) {Child()Child2()}}
}//子组件1
@Component
struct Child {@LocalStorageProp('name') name:string='' //姓名build() {Column({ space: 20 }) {Text(`姓名为${this.name}`)}}
}//子组件2
@Component
struct Child2 {@LocalStorageLink('name') name:string='' //姓名build() {Column({ space: 20 }) {Button('改变姓名').onClick(()=>{this.name='李四'})}}
}

运行效果:和方法一:@Provide和@Consume示例一样效果


方法四:@StorageProp和@StorageLink

见下文介绍


方法五:eventHub

见下文介绍


方法六:globalThis

见下文介绍


三、不同页面组件间数据传递

方法一:@StorageProp和@StorageLink

@StorageProp和@StorageLink是应用全局的UI状态存储,与之对应的是全局静态类AppStorage。和进程绑定,同一进程下的所有页面共用。

示例:

第一个页面Index.ets

import { router } from '@kit.ArkUI'AppStorage.setOrCreate('name','张三')
@Entry
@Component
struct Index {@StorageProp('name') name:string=''build() {Column({space:20}) {Text(`姓名为:${this.name}`)Button('跳转下一页').onClick(()=>{router.pushUrl({url:'pages/Second'})})}.width('100%').height('100%').padding({top:30})}
}

第二个页面Second.ets

import { router } from '@kit.ArkUI'@Entry
@Component
struct Second {@StorageLink('name') name: string = ''build() {Column({space:20}) {Text(`当前姓名:${this.name}`)Button('改变姓名值').onClick(() => {this.name = '李四'})Button('返回').onClick(()=>{router.back()})}.width('100%').height('100%').padding({top:30})}
}

运行效果:
请添加图片描述

方法二:eventHub

eventHub和vue中eventBus一样使用方法也类似安卓的广播机制,通过emit发出事件(广播)并携带参数,在有注册该事件(on)的页面会同步接收到该事件的回调,

eventHub.emit():发出事件
eventHub.on():注册事件
eventHub.off():解绑事件

ps:需要注意的是离开页面必须进行解绑,不然再次打开会页面会造成多次注册导致同一个事件被多次触发回调

eventHub为Context上一个属性对象,在页面内通过getContext().eventHub获取

示例:
场景:个人信息编辑成功后通知前面页面更新个人信息

第一个页面Index.ets

import { router } from '@kit.ArkUI'//父组件
@Entry
@Component
struct Index {@State name: string = '张三';@State age: number = 25aboutToAppear(): void {//注册事件getContext().eventHub.on('userInfoChange', this.handleUserInfoChange.bind(this))}aboutToDisappear(): void {//解绑事件getContext().eventHub.off('userInfoChange', this.handleUserInfoChange.bind(this))}//用户信息修改成功回调private handleUserInfoChange(data: Record<string, string>) {this.name = data.name ?? ''this.age = data.age ? Number(data.age) : this.age}build() {Column({ space: 20 }) {Text(`姓名:${this.name}`)Text(`年龄:${this.age}`)Button('修改个人信息').onClick(() => {router.pushUrl({url: 'pages/Editor'})})}.width('100%').padding({ top: 20 })}
}

第二个页面:Editor.ets

import { promptAction, router } from '@kit.ArkUI'@Entry
@Component
struct Editor {@State name:string=''@State age:string=''build() {Column({space:15}) {TextInput({placeholder:'请输入姓名',text:$$this.name})TextInput({placeholder:'请输入年龄',text:$$this.age}).type(InputType.Number)Button('提交').onClick(()=>{getContext().eventHub.emit('userInfoChange',{age:this.age,name:this.name})promptAction.showToast({message:'修改成功'})router.back()})}.width('100%').height('100%').justifyContent(FlexAlign.Center).padding(20)}
}

ps:注意this的指向,绑定回调函数需要用bind(this)

运行效果:
请添加图片描述

eventHub在实际项目开发中非常实用,可以很轻松实现任意不同页面或组件之间的通信。常用于一些需要刷新页面操作的场景,除了上述例子外,还可以应用于提交一个表单数据后通知前面页面刷新列表数据,或者比如在支付完成后通知订单列表刷新订单状态等。

ps:注意预览器和真机的差异性对eventHub支持不友好,所以如有使用eventHub功能要在真机或者模拟器测试

方法三:globalThis

globalThis是ArkTS引擎实例内部的一个全局对象,引擎内部的UIAbility/ExtensionAbility/Page都可以使用,简单说globalThis是一个全局对象变量,所有页面都可以直接引用,所以可以把数据存到globalThis属性上供其他页面使用

示例:
以方法eventHub示例一样功能场景用globalThis实现

第一个页面Index.ets

import { router } from '@kit.ArkUI'//父组件
@Entry
@Component
struct Index {@State name: string = ''@State age: number = 0build() {Column({ space: 20 }) {Text(`姓名:${this.name}`)Text(`年龄:${this.age}`)Button('修改个人信息').onClick(() => {router.pushUrl({url: 'pages/Editor'})})}.width('100%').padding({ top: 20 }).onVisibleAreaChange([0.0, 1.0], async (isVisible: boolean, currentRatio: number) => {//页面重新加载从globalThis获取最新数据this.name = globalThis.name ?? '张三'this.age = globalThis.age ?? 25})}
}

第二个页面:Editor.ets

import { promptAction, router } from '@kit.ArkUI'@Entry
@Component
struct Editor {build() {Column({space:15}) {TextInput({placeholder:'请输入姓名'}).onChange((value:string)=>{//姓名数据存储到全局globalThisglobalThis.name=value})TextInput({placeholder:'请输入年龄'}).type(InputType.Number).onChange((value:string)=>{//年龄数据存储到全局globalThisglobalThis.age=value})Button('提交').onClick(()=>{promptAction.showToast({message:'修改成功'})router.back()})}.width('100%').height('100%').justifyContent(FlexAlign.Center).padding(20)}
}

实现效果:如方法2所示

需要注意的是globalThis全局变量数据非响应式,如有更新,需要在返回第一个页面从重新获取。
globalThis为全局变量为了避免变量污染,尽可能优先使用其他方案替代。


四、父组件调用子组件内部方法

方法提炼:子组件暴露一个回调方法,把子组件实例通过入参回传给父组件,父组件全局缓存子组件实例,在需要的时候调用子组件实例上方法。

示例:
下面实现一个这样场景需求:页面重复倒计时5秒后刷新列表数据,其中列表在子组件渲染,刷新动作在父组件触发

import { SwipeRefresher } from '@kit.ArkUI';//父组件
@Entry
@Component
struct Parent {child: Child | null = null; //子组件实例@State count: number = 5aboutToAppear(): void {setInterval(() => {this.count--if (this.count < 0) {//重新获取子组件数据this.child && this.child.getData();this.count = 5}}, 1000)}build() {Column({ space: 20 }) {Text(`倒计时:${this.count}`)Child({complete: (child: Child) => {this.child = child}})}.width('100%')}
}//子组件
@Component
struct Child {//初始化回调complete: (child: Child) => void = () => {}@State list: number[] = []@State isLoading: boolean = falseaboutToAppear(): void {//把子组件实例回传给父组件this.complete(this)this.getData()}//模拟接口获取列表数据getData() {this.isLoading = truelet list: number[] = []for (let i = 1; i < 6; i++) {list.push(this.getRandom())}this.list = listsetTimeout(() => {this.isLoading = false}, 1000)}//获取随机数getRandom() {return Math.round(Math.random() * 10000)}build() {Column() {if (this.isLoading) {SwipeRefresher({content: '正在加载中',isLoading: this.isLoading})} else {List() {ForEach(this.list, (item: number, index: number) => {ListItem() {Text(item.toString()).width('100%').height(80).textAlign(TextAlign.Center).border({width: {bottom: 1}})}.width('100%')}, (item: number, index: number) => item.toString())}.width('100%')}}.width('100%').height('100%')}
}

运行效果:
请添加图片描述

四、子组件调用父组件内部方法

方法提炼:父组件实例当参数传递给子组件,子组件缓存父组件实例,在需要的时候调用实例上方法

示例:
下面实现一个这样场景需求:父组件有一个加载中组件,对应有关闭和显示2个控制方法。子组件接口正在请求数据时显示加载中,接口请求完毕后关闭加载中。

import { SwipeRefresher } from '@kit.ArkUI';//父组件
@Entry
@Component
struct Parent {@State isLoading: boolean = false//显示加载中showLoading() {this.isLoading = true}//隐藏加载中hideLoading() {this.isLoading = false}build() {Column({ space: 20 }) {if (this.isLoading) {SwipeRefresher({content: '正在加载中',isLoading: this.isLoading})}Child({parent: this})}.width('100%')}
}//子组件
@Component
struct Child {parent: Parent | null = nullbuild() {Column() {Button('加载数据').onClick(() => {this.parent?.showLoading()//模拟接口请求2秒后关闭加载显示setTimeout(() => {this.parent?.hideLoading()}, 2000)})}.width('100%').height('100%')}
}

运行效果:
请添加图片描述

五、路由跳转和传参

1、通过 router.pushUrl( options: RouterOptions)实现路由跳转

RouterOptions:类型属性字段:
url:目标页面的url
params:路由跳转时要同时传递到目标页面的数据

import { router } from '@kit.ArkUI'
......
.....
router.pushUrl({url:'pages/Editor',params:{name:'张三',}})

2、通过router.getParams()获取路由参数

aboutToAppear(): void {//获取路由参数let params = router.getParams() as Record<string, string >console.log( params['name'] as string )}

代码示例:
由页面A跳转到页面B并携带姓名和年龄参数

页面A:
Index.ets

//父组件
import { router } from '@kit.ArkUI'@Entry
@Component
struct Parent {build() {Column({ space: 20 }) {Button('跳转下一页').onClick(()=>{router.pushUrl({url:'pages/Editor',params:{name:'张三',age:20}})})}.width('100%')}
}

页面B:
Editor.ets

import { router } from '@kit.ArkUI'@Entry
@Component
struct Editor {@State name: string = ''//姓名@State age: string = ''//年龄aboutToAppear(): void {//获取路由参数let params = router.getParams() as Record<string, string | number>this.name = params['name'] as string ?? ''this.age =( params['age'] as number ?? 0).toString()}build() {Column({ space: 15 }) {TextInput({ placeholder: '请输入姓名', text: $$this.name })TextInput({ placeholder: '请输入年龄', text: $$this.age }).type(InputType.Number)}.width('100%').height('100%').justifyContent(FlexAlign.Center).padding(20)}
}

运行效果:
请添加图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/472096.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LeetCode654.最大二叉树

LeetCode刷题记录 文章目录 &#x1f4dc;题目描述&#x1f4a1;解题思路⌨C代码 &#x1f4dc;题目描述 给定一个不重复的整数数组 nums 。 最大二叉树 可以用下面的算法从 nums 递归地构建: 创建一个根节点&#xff0c;其值为 nums 中的最大值。 递归地在最大值 左边 的 子…

电子应用产品设计方案-9:全自动智能马桶系统设计方案

一、系统概述 本全自动智能马桶系统旨在提供舒适、卫生、便捷和智能化的如厕体验。通过融合多种传感器技术、电子控制单元和机械执行机构&#xff0c;实现马桶的自动冲洗、座圈加热、臀部清洗、烘干等功能&#xff0c;并具备智能感应、用户个性化设置和健康监测等特色功能。 二…

酒水分销积分商城小程序开发方案php+uniapp

酒水分销积分商城小程序开发&#xff0c;开发语言后端php&#xff0c;前端uniapp。核心功能模块&#xff1a;酒水商城、积分商城、二级分销、抽奖、优惠券。可以二开或定制。协助部署搭建。

UNIX网络编程-TCP套接字编程(实战)

概述 TCP客户端/服务器程序示例是执行如下步骤的一个回射服务器&#xff1a; 客户端从标准输入读入一行文本&#xff0c;并写给服务器。服务器从网络输入读入这行文本&#xff0c;并回射给客户端。客户端从网络输入读入这行回射文本&#xff0c;并显示在标准输出上。 TCP服务器…

Kafka-Eagle的配置——kafka可视化界面

通过百度网盘分享的文件&#xff1a;kafka-eagle-bin-2.0.8.tar.gz 链接&#xff1a;https://pan.baidu.com/s/1H3YONkL97uXbLTPMZHrfdg?pwdsltu 提取码&#xff1a;sltu 一、界面展示 二、软件配置 1、关闭kafka集群 kf.sh stop 2、将该软件上传到/opt/modules下 cd /opt…

Uniapp踩坑input自动获取焦点ref动态获取实例不可用

前言 大家好我是没钱的君子下流坯&#xff0c;用自己的话解释自己的知识。很久很更新了&#xff0c;这几个月一直在加班&#xff0c;今天记录一个uniapp关于input中focus()方法自动获取焦点的坑。 案例 为了实现一个手机验证码的页面&#xff0c;验证码是五个输入框&#xf…

报错 No available slot found for the embedding model

报错内容 Server error: 503 - [address0.0.0.0:12781, pid304366] No available slot found for the embedding model. We recommend to launch the embedding model first, and then launch the LLM models. 目前GPU占用情况如下 解决办法: 关闭大模型, 先把 embedding mode…

AI大模型(二):AI编程实践

一、软件安装 1. 安装 Visual Studio Code VSCode官方下载&#xff1a;Visual Studio Code - Code Editing. Redefined 根据自己的电脑系统选择相应的版本下载 安装完成&#xff01; 2. 安装Tongyi Lingma 打开VSCode&#xff0c;点击左侧菜单栏【extensions】&#xff0c;…

MFC程序崩溃时生成dmp文件

#include “HiExceptionHandle.h” #include <string> #pragma once class HiExceptionHandle { public:HiExceptionHandle(void);~HiExceptionHandle(void); public:void RunCrashHandler();void SetWERDumpLocation(const std::wstring dumpFolderPath); protected:st…

释放高级功能:Nexusflows Athene-V2-Agent在工具使用和代理用例方面超越 GPT-4o

在不断发展的人工智能领域&#xff0c;Nexusflows 推出了 Athene-V2-Agent 作为其模型系列的强大补充。这种专门的代理模型设计用于在功能调用和代理应用中发挥出色作用&#xff0c;突破了人工智能所能达到的极限。 竞争优势 Athene-V2-Agent 不仅仅是另一种人工智能模型&…

Flutter:input输入框

输入框&#xff1a; // 是否显示关闭按钮 bool _showClear false; // 文字编辑控制器&#xff0c;监听搜索框的变化。 final TextEditingController _controller TextEditingController(); // 输入框发生变化事件 void _onChange(String value){if(value.length > 0){setS…

vue 项目使用 nginx 部署

前言 记录下使用element-admin-template 改造项目踩过的坑及打包部署过程 一、根据权限增加动态路由不生效 原因是Sidebar中路由取的 this.$router.options.routes,需要在计算路由 permission.js 增加如下代码 // generate accessible routes map based on roles const acce…

鸿蒙next ui安全区域适配(刘海屏、摄像头挖空等)

目录 相关api 团结引擎对于鸿蒙的适配已经做了安全区域的适配&#xff0c;也考虑到了刘海屏和摄像机挖孔的情况&#xff0c;在团结引擎内可以直接使用Screen.safeArea 相关api 团结引擎对于鸿蒙的适配已经做了安全区域的适配&#xff0c;也考虑到了刘海屏和摄像机挖孔的情况&am…

多端校园圈子论坛小程序,多个学校同时代理,校园小程序分展示后台管理源码

社团活动与组织 信息发布&#xff1a;系统支持社团发布活动信息、招募新成员等&#xff0c;方便社团进行线上线下活动的组织和管理。 增强凝聚力&#xff1a;通过系统&#xff0c;社团成员可以更好地交流和互动&#xff0c;增强社团的凝聚力和影响力。 生活服务功能 二手市场…

SpringCloud-使用FFmpeg对视频压缩处理

在现代的视频处理系统中&#xff0c;压缩视频以减小存储空间、加快传输速度是一项非常重要的任务。FFmpeg作为一个强大的开源工具&#xff0c;广泛应用于音视频的处理&#xff0c;包括视频的压缩和格式转换等。本文将通过Java代码示例&#xff0c;向您展示如何使用FFmpeg进行视…

MySQL-初识数据库

目录 一、数据库基础概念 1、SQL 2、数据&#xff08;Data&#xff09; 3、数据库&#xff08;DB&#xff09; 4、数据库管理系统DBMS 5、数据库系统DBS 6、关系模型&#xff08;Relational Model&#xff09; 7、E-R图 8、常见的数据库 9、数据库基本操作 一、数据库…

【C语言】实现二维数组按列排序

文章目录 代码实现代码解释注意事项 代码实现 下面是一个C语言程序&#xff0c;它读取用户输入的4行5列的二维数组&#xff0c;并按照列对数组进行排序。 #include <stdio.h>int main() {int a[4][5]; // 定义一个4行5列的二维数组// 读取用户输入的二维数组for (int i…

aws ses 设置发件人昵称

看到别人的发的都是有昵称的&#xff0c;自己发的就是直接展示noreply 其实很简单&#xff1a; 只需要把发件人改成“nickname<noreplyxxx.com>”就行了

51c大模型~合集42

我自己的原文哦~ https://blog.51cto.com/whaosoft/11859244 #猎户座 「草莓」即将上线&#xff0c;OpenAI新旗舰大模型曝光&#xff0c;代号「猎户座」 ChatGPT 要进化了&#xff1f; 本月初&#xff0c;OpenAI 创始人、CEO 山姆・奥特曼突然在 X 上发了一张照片&#xff0…

【算法】二分查找

基本内容 提高在有序的数组中查找满足某一条件的索引 二分查找的基本类型 ① 有多种情况满足条件&#xff0c;找到满足条件的最右索引&#xff0c;例如找到值为4的最右索引&#xff08;也可以换为小于5的最后一个元素&#xff09; ​ ② 有多种情况满足条件&#xff0c;找到满…