uni-app 使用笔记

1.缓存用法

（1）uni-app 存值+取值+删除

官网：https://uniapp.dcloud.net.cn/api/storage/storage.html#setstorage
存值

uni.setStorageSync('storage_key', 'hello');

取值

uni.getStorageSync('storage_key')

删除

uni.removeStorageSync('storage_key')

2.列表左侧点击访问详情，右侧点击处理业务

（1）效果

在这里插入图片描述

(2)代码

<template>
  <uni-list>
  	<uni-list-item v-for="item in hospitalJobRequireList" :title="item.hosName" :note="item.jobName" clickable @click="onClick(item)">
      <template v-slot:footer v-if="item.isGw=='N'">
        <button style="height: 45px;width: 100px;" class="uni-icon yticon icon-shanchu" @click.stop="rightClick(item)">岗位申请</button>
      </template>
    </uni-list-item>
  </uni-list>
</template>

<script>
import {applyList} from "@/api/expertVeteran/hospital";

export default {
  data() {
    return {
      hospitalJobRequireList: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        hospitalId: null,
        jobName: null,
        num: null,
        description: null,
        professionalRequire: null,
        eduRequire: null,
        postRequire: null,
        salary: null,
        contact: null,
        phone: null,
        email: null,
        workLocation: null,
        status: null,
        sort: null,
      },
    }
  },
  created(){
    this.getList();
  },
  methods:{
    /** 查询医院岗位需求列表 */
    getList() {
      this.$modal.loading("数据加载中...")
      applyList(this.queryParams).then(response => {
        console.log(response)
        this.hospitalJobRequireList = response.rows;
        this.$modal.closeLoading();
      });
    },
    onClick(data){
       this.$tab.navigateTo(`/pages/expertVeteran/hospital/job/detail?id=${data.id}`)
    },
    rightClick(){
      this.$modal.showToast('点击右侧按钮调用')
    }
  }
}
</script>

<style>
/* 样式按需添加 */
.uni-icon {
  margin-right: 10px; /* 调整右侧图标与文字的间隔 */
}
</style>