arco-design/arco-design-vue

Table Columns 使用render 在Nuxtjs中组件未被正常编译

Closed this issue · 1 comments

基本信息

  • 依赖包名 及 版本: @arco-design/web-vue@2.55.3
  • 框架版本: vue3
  • 浏览器版本: chrome126.0.0.0

额外补充

下载最新的Nuxt模板
pnpm dlx nuxi@latest init
安装Arco
pnpm add -D arco-design-nuxt-module
复制上面的代码
pnpm run build && pnpm run preview

在vue 项目中编译后能正常显示,但是nuxt不行

预期结果

开发模式正常,但是在打包后预览a-tag未被编译,
希望a-tag 能正常显示

复现步骤

Nuxt最新版,Arco最新版
示例代码

<script setup lang="jsx">
import { reactive } from 'vue'
const originColumns = [
  {
    title: 'Name',
    dataIndex: 'name',
    width: 200,
    render({ record }) {
      return <a-tag>{record.name}</a-tag>
    },
  },
  {
    title: 'Salary',
    dataIndex: 'salary',
    // slotName: 'salary',

    width: 200,
  },
  {
    title: 'Address',
    dataIndex: 'address',
    width: 200,
  },
  {
    title: 'Email',
    dataIndex: 'email',
    width: 200,
    render({ record }) {
      return <a-tag>{record.email}</a-tag>
    },
  },
]

const data = reactive([
  {
    key: '1',
    name: 'Jane Doe',
    salary: 23000,
    address: '32 Park Road, London',
    email: 'jane.doe@example.com',
  },
  {
    key: '2',
    name: 'Alisa Ross',
    salary: 25000,
    address: '35 Park Road, London',
    email: 'alisa.ross@example.com',
  },
  {
    key: '3',
    name: 'Kevin Sandra',
    salary: 22000,
    address: '31 Park Road, London',
    email: 'kevin.sandra@example.com',
  },
  {
    key: '4',
    name: 'Ed Hellen',
    salary: 17000,
    address: '42 Park Road, London',
    email: 'ed.hellen@example.com',
  },
  {
    key: '5',
    name: 'William Smith',
    salary: 27000,
    address: '62 Park Road, London',
    email: 'william.smith@example.com',
  },
])
</script>

<template>

  <a-table :columns="originColumns" :data="data" />
</template>

这不是arco得问题,是nuxt的问题,请把他关闭掉吧