tall-mui-3-project/src/components/Title/Title.vue

<template>
  <view>
    <u-navbar class="overflow-hidden" :is-back="false">
      <view class="flex justify-start flex-1 px-3 font-bold min-0">
        <view class="truncate">{{ project.name }}</view>
      </view>
      <view class="mr-2" slot="right">
        <u-icon class="m-1" name="xuanzhong2" custom-prefix="custom-icon" size="20px" @click="lwbs"></u-icon>
        <u-icon class="m-1" name="shuaxin1" custom-prefix="custom-icon" size="20px" @click="projectOverview"></u-icon>
        <u-icon class="m-1" name="home" custom-prefix="custom-icon" size="20px" @click="openIndex"></u-icon>
        <u-icon class="m-1" name="xuanxiang" custom-prefix="custom-icon" size="20px" @click="operation"></u-icon>
      </view>
    </u-navbar>
  </view>
</template>
<script>
import { mapGetters, mapState } from 'vuex';

export default {
  name: 'ProjectTitle',
  data() {
    return { showBack: false };
  },
  computed: {
    ...mapState('project', ['project']),
    ...mapGetters('user', ['userId']),
  },

  methods: {
    // LWBS提示
    lwbs() {
      // this.$t.ui.showToast('LWBS');
    },
    //项目概览
    projectOverview() {
      // this.$t.ui.showToast('项目概览');
    },
    // 回到首页
    openIndex() {
      this.$u.route('/', { u: this.userId });
    },
    //操作
    operation() {
      // this.$t.ui.showToast('操作');
    },
  },
};
</script>

<style lang="scss" scoped>
::deep .u-slot-content {
  min-width: 0;
}
</style>