项目这个功能咋实现 初始页面文本框内默认展示名称：“企业名称”+员工专属福利活动，“企业名称”从立项平台获取，举例：企业名称为“娃哈哈集团”，则企业专属福利活动名称为：娃哈哈集团员工专属福利活动。 用Vue3 实现这个功能

在Vue3中实现这个功能，你可以使用Composition API来管理状态并结合模板渲染。首先，你需要创建一个Vue组件，并设置一个计算属性来动态生成文本内容。这里是一个简单的示例：

<template>
  <div>
    <input type="text" v-model="enterpriseName" :value="formattedTitle" disabled>
  </div>
</template>

<script setup>
import { ref, computed } from 'vue';

// 定义企业名称和福利活动名的变量
const enterpriseName = ref('');

// 根据企业名称计算并格式化福利活动标题
const formattedTitle = computed({
  get() {
    return `${enterpriseName.value}员工专属福利活动`;
  },
});

// 假设你有一个函数来获取企业名称，实际应用中替换为从立项平台获取数据
async function fetchEnterpriseName() {
  // 这里只是一个模拟，真实情况需要连接API或者其他数据源
  const name = await '娃哈哈集团'; // 从立项平台获取
  setEnterpriseName(name);
}

// 初始化组件时调用获取企业名称
fetchEnterpriseName();
</script>

在这个例子中，当你从立项平台获取到企业名称后，`formattedTitle`会自动更新显示。用户无法修改输入框的内容，因为它是`disabled`的。