概述
本示例展示了同一设备中前后台的数据交互，用户前台选择相应的商品与数目，后台计算出结果，回传给前台展示。
样例展示
基础信息
RPC连接
介绍
本示例使用[@ohos.rpc]相关接口，实现了一个前台选择商品和数目，后台计算总价的功能，使用rpc进行前台和后台的通信。
效果预览
| 主页 | 选择列表 |
|---|---|
 |
 |
使用说明：
- 点击商品种类的空白方框，弹出商品选择列表，选择点击对应的商品，空白方框显示相应内容。
- 点击商品选择框后的 + 或 - 按钮，选择商品所对应的数量。
- 点击 Confirm an order 按钮，根据相应的菜品数量与单价，计算出总价并显示。
具体实现
-
发送数据：在首页的sortString()中通过rpc.MessageSequence.create()创建MessageSequence对象，然后通过MessageSequence.writeStringArray()将 我们的处理过的购物数据写入MessageSequence对象中，通过rpc.RemoteObject.sendMessageRequest()将我们得出总价所需要的参数发送到进程中， 源码参考：[Index.ets]
/*
-
Copyright (c) 2021-2023 Huawei Device Co., Ltd.
-
Licensed under the Apache License, Version 2.0 (the "License");
-
you may not use this file except in compliance with the License.
-
You may obtain a copy of the License at
-
http://www.apache.org/licenses/LICENSE-2.0 -
Unless required by applicable law or agreed to in writing, software
-
distributed under the License is distributed on an "AS IS" BASIS,
-
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-
See the License for the specific language governing permissions and
-
limitations under the License.
*/
import rpc from '@ohos.rpc'
import ReceivedData from '../model/ReceivedData'
import { ProcessData } from '../model/ProcessData'
import { Logger } from '../common/Logger'
import { MyDataSource } from '../model/OptionsData'
import { OPTIONS } from '../muck/MyData'
import { TitleBar } from '../common/TitleBar'
import { FlexList } from '../common/FlexList'
const REQUEST_CODE: number = 1
type SelectType = {
subcategory: string, count: number}
@Entry
@Component
struct Index {
@State send: string = '' @State result: number = 0 private Process: ProcessData = new ProcessData() private selectStuffs: Array<SelectType> = new Array(4).fill({ subcategory: '', count: 0 }) selectStuff(index: number, good: string, count: number) { Logger.info(`index= ${index}, count= ${count}, good= ${good}`) this.selectStuffs[index] = { subcategory: good, count: count } } async sortString(sendData: Array<string>) { Logger.info(`sortString is ${sendData}`) Logger.info(`sendData typeof ${typeof (sendData)}`) let option: rpc.MessageOption = new rpc.MessageOption() let data: rpc.MessageSequence = rpc.MessageSequence.create() let reply: rpc.MessageSequence = rpc.MessageSequence.create() Logger.info(`getCallingUid: ${ReceivedData.getCallingUid()} getCallingPid: ${ReceivedData.getCallingPid()}`) data.writeStringArray(sendData) try { await ReceivedData.sendMessageRequest(REQUEST_CODE, data, reply, option) } catch (err) { Logger.error(`sortString failed, ${JSON.stringify(err)}`) } this.result = reply.readInt() reply.reclaim() } build() { Scroll() { Column() { TitleBar() LazyForEach(new MyDataSource(OPTIONS), (item, index) => { Row() { FlexList({ category: item.category, menu: item.subcategory, index: index, selectStuff: this.selectStuff.bind(this) }) } }, item => JSON.stringify(item)) Column() { Row() { Text($r('app.string.final_price')) .width('65%') .height(25) .fontSize(18) .textAlign(TextAlign.Center) Text(this.result.toString()) .id('totalPrice') .height(25) .fontSize(20) .margin({ left: '5%' }) .textAlign(TextAlign.Center) } .justifyContent(FlexAlign.Center) .width('80%') Button($r('app.string.confirm')) .id('confirmOrderBtn') .width('80%') .height(40) .margin({ top: 30 }) .onClick(() => { let priceArray = this.Process.getPrice(this.selectStuffs) Logger.info(`priceArray= ${priceArray}`) this.sortString(priceArray) }) } .width('100%') .justifyContent(FlexAlign.Center) .margin({ top: 20 }) .height('30%') } .width('100%') } }}
-
-
读取数据：处理MessageRequest请求的接口封装在ReceivedData里面，在这里接收传递来的数据，然后经过处理得出总价， 并通过rpc.MessageParcel.writeInt()写入MessageParcel对象，源码参考：[ReceivedData.ets]
/*
-
Copyright (c) 2021-2023 Huawei Device Co., Ltd.
-
Licensed under the Apache License, Version 2.0 (the "License");
-
you may not use this file except in compliance with the License.
-
You may obtain a copy of the License at
-
http://www.apache.org/licenses/LICENSE-2.0 -
Unless required by applicable law or agreed to in writing, software
-
distributed under the License is distributed on an "AS IS" BASIS,
-
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-
See the License for the specific language governing permissions and
-
limitations under the License.
*/
import rpc from '@ohos.rpc'
import { Logger } from '../common/Logger'
import { PRICE_LIST } from '../muck/MyData'
const TAG = '[eTSRPC.ReceivedData]'
let resultList: Array<number> = Array.from({ length: 4 }, () => 0)
class ReceivedData extends rpc.RemoteObject {
onRemoteRequest(code: number, data: rpc.MessageParcel, reply: rpc.MessageParcel, option: rpc.MessageOption): boolean { Logger.info(TAG, `called`) if (code === 1) { let result = 0 let readIntArr try { readIntArr = data.readStringArray() } catch (err) { Logger.error(`readStringArray failed, code is ${err.code}, message is ${err.message}`) } Logger.info(TAG, `readIntArr= ${readIntArr}`) for (let i = 0; i < 4; i++) { if (readIntArr[i] === '0') { resultList[i] = 0 } else { resultList[i] = PRICE_LIST.get(readIntArr[i]) * Number(readIntArr[i+4]) } Logger.info(TAG, `this.resultList= ${resultList}`) result += resultList[i] } try { reply.writeInt(result) } catch (err) { Logger.error(TAG, `writeInt failed, code is ${err.code}, message is ${err.message}`) } Logger.info(TAG, `result= ${result}`) } else { Logger.info(TAG, `unknown request code`) } return true }}
export default new ReceivedData('send')
-
