<template> <view> <text class="text-title">翻译历史:</text> <uni-list v-for="(elem,index) in searchHistory" :key="index"> <uni-list-item :title="elem.searchValue" :rightText="getLanguageTransfer(elem.fromLanguage,elem.toLanguage)" @click="itemClick(elem)" clickable></uni-list-item> </uni-list> </view> </template> <script> import { sha256 } from 'js-sha256'; export default { data() { return { searchHistory: [], array: [{ name: '中文', code: 'zh-CHS' }, { name: '英文', code: 'en' }, { name: '德文', code: 'de' }, { name: '日文', code: 'ja' }, { name: '法文', code: 'fr' }, { name: '韩文', code: 'ko' }] } }, methods: { itemClick(data) { if (data.searchValue.length > 0) { console.log(data.searchValue); console.log(data.fromLanguage); console.log(data.toLanguage); let salt = (new Date).getTime(); let appKey = '03949e1a6a334f86'; let appSecret = '9u6wiw517BYJ8ggnFIdcwoYGmqtsOHUl'; let curtime = Math.round(new Date().getTime() / 1000); let input = data.searchValue.length <= 20 ? data.searchValue : data.searchValue.slice(0, 10) + data .searchValue.length + data.searchValue.slice(-10); uni.request({ url: '/youdaoApi/api', url: 'https://openapi.youdao.com/api', method: 'GET', data: { q: data.searchValue, from: data.fromLanguage, to: data.toLanguage, appKey: appKey, salt: salt, curtime: curtime, sign: sha256(appKey + input + salt + curtime + appSecret), signType: 'v3' }, success: (data) => { this.$store.commit('setOutcome', data); uni.switchTab({ url: '/pages/translateresult/translateresult' }); } }) } }, getLanguageTransfer(from, to) { let fromStr = this.array.find(item => { return item.code == from; }); let toStr = this.array.find(item => { return item.code == to; }); return fromStr.name + '->' + toStr.name; } }, onshow() { this.searchHistory = Array.from(this.$store.getters.getHistoryList); console.log(this.searchHistory); console.log("1" + this.$store.getters.getHistoryList); this.serachHistory.reverse(); } } </script> <style> .text-title { font-size: 45rpx; color: coral; margin-top: 100rpx; } </style>

根据您提供的代码，我看不出具体哪里会调用 omShow() 方法，因为代码中并没有出现这个方法名。不过，可以看出您的代码有两个问题：

1.在 `uni.request()` 函数的参数中，有两个 `url` 属性，这是不正确的。应该将其中一个删除。

2.在 `onshow()` 方法中，您将 `this.serachHistory` 改为了 `this.searchHistory` 的拼写错误，导致无法正确地将搜索历史列表显示在页面上。正确的代码应该是：

onShow() {
  this.searchHistory = Array.from(this.$store.getters.getHistoryList);
  console.log(this.searchHistory);
  console.log("1" + this.$store.getters.getHistoryList);
  this.searchHistory.reverse();
}

希望这些信息能帮到您，如果您还有其他问题，欢迎随时提出。

相关问题

<template> <view class="mine-panel-list"> <view class="mine-panel-item"> <uni-forms ref="mineForm" :rules="mineRules" :modelValue="mineFormData"> <uni-forms-item label="姓名" :required="true" name="name"> <uni-easyinput v-model="mineFormData.name" placeholder="请填写姓名" :clearable="false"></uni-easyinput> </uni-forms-item> </uni-forms> </view> <button type="primary" size="mini" @click="save('mineForm')">保存</button> </view> </template> <script> export default { data() { return { mineFormData: { name: uni.getStorageSync('name') || '', // 从本地存储获取之前保存的姓名 }, } }; }, onReady() { this.$refs.mineForm.setRules(this.mineRules) }, methods: { save(ref) { this.$refs[ref].validate().then(res => { console.log('success', res); uni.setStorageSync('name', this.mineFormData.name); // 将姓名保存到本地存储 uni.showToast({ title: '保存成功' });this.$emit('update-name', this.mineFormData.name); }).catch(err => { console.log('err', err); }) } } } </script>这是mine.vue的代码

感谢提供了`mine.vue`的代码。根据你的代码，我注意到在`mine.vue`组件中，你使用了`uni-forms`和`uni-easyinput`组件来实现表单和输入框功能，并在保存按钮的点击事件中进行了表单验证和保存操作。

根据你的描述，你想要在`home.vue`页面中显示`mine.vue`组件中填入的姓名信息。为了实现这个目标，请按照以下步骤进行修改：

1. 在`home.vue`组件的模板中，将`<mine></mine>`标签放在需要显示姓名信息的位置，例如：

<template>
  <div>
    <p>{{ mineName }}</p>
    <mine ref="mineComponent" @update-name="updateName"></mine>
  </div>
</template>

2. 在`home.vue`组件的脚本中，添加一个名为`updateName`的方法，用于更新姓名信息：

<script>
export default {
  data() {
    return {
      mineName: ''
    };
  },
  methods: {
    updateName(name) {
      this.mineName = name;
    }
  }
}
</script>

3. 在`mine.vue`组件的保存按钮点击事件中，添加一个触发事件，将姓名信息传递给父组件：

methods: {
  save(ref) {
    this.$refs[ref].validate().then(res => {
      console.log('success', res);
      uni.setStorageSync('name', this.mineFormData.name); // 将姓名保存到本地存储
      uni.showToast({
        title: '保存成功'
      });
      this.$emit('update-name', this.mineFormData.name); // 触发事件，将姓名信息传递给父组件
    }).catch(err => {
      console.log('err', err);
    })
  }
}

通过以上修改，当在`mine.vue`组件中填入姓名并点击保存后，姓名信息将会传递给`home.vue`组件，并更新`mineName`变量，从而在页面上显示出来。

希望这次能够解决问题。如果还有其他疑问，请随时提出。

如何在uni-app的组件uni-list-item中同时设置title和note的样式属性？

在uni-app的组件`uni-list-item`中，可以通过自定义样式来同时设置`title`和`note`的样式属性。具体步骤如下：

1. **使用`slot`插槽**：在`uni-list-item`组件中，`title`和`note`可以通过`slot`插槽来自定义内容。
2. **自定义样式**：通过在`slot`中嵌套自定义的HTML元素，并使用CSS类来设置样式。

以下是一个示例代码，展示了如何在`uni-list-item`中同时设置`title`和`note`的样式属性：

<template>
  <uni-list>
    <uni-list-item>
      <template v-slot:body>
        <view class="custom-title">这是标题</view>
        <view class="custom-note">这是备注</view>
      </template>
    </uni-list-item>
  </uni-list>
</template>

<script>
export default {
  data() {
    return {};
  }
};
</script>

<style scoped>
.custom-title {
  font-size: 18px;
  font-weight: bold;
  color: #333;
}

.custom-note {
  font-size: 14px;
  color: #666;
  margin-top: 5px;
}
</style>

在这个示例中，我们使用了`v-slot:body`来定义`body`插槽的内容，并在其中嵌套了两个`view`元素，分别用于显示`title`和`note`。通过为这两个`view`元素设置自定义的CSS类，我们可以轻松地控制它们的样式。