d-render

基于 Element Plus 二次封装的数据驱动渲染组件库 - 表单、搜索表单、表格配置化渲染
8,750 5
Install
npm install d-render
Latest Version:3.2.3
Vue:3
License:MIT
Last Updated:Aug 13, 2026
Links: GitHub  ·  npm
Maintainer: s501235949

d-render

基于 Element Plus 二次封装的数据驱动渲染组件库

npm version license

📚 文档

在线文档: https://d-render.github.io/d-render/

✨ 特性

  • 🚀 配置驱动 - 通过 JSON 配置即可渲染复杂表单
  • 🔗 数据联动 - 强大的 dependOn 机制
  • 📦 开箱即用 - 基于 Element Plus 二次封装
  • 🎨 自定义类型 - 轻松扩展自定义组件
  • 📱 多端适配 - 支持 PC 和移动端
  • 🔧 TypeScript - 完整类型支持

📥 安装

# npm
npm install d-render element-plus -S

# yarn
yarn add d-render element-plus -S

# pnpm
pnpm add d-render element-plus -S

🚀 快速开始

<template>
  <DrForm v-model:model="model" :fieldList="fieldList" />
</template>

<script setup>
import { ref } from 'vue'
import { generateFieldList, defineFormFieldConfig } from 'd-render'

const model = ref({})

const fieldList = generateFieldList(defineFormFieldConfig({
  name: {
    type: 'input',
    label: '姓名',
    required: true
  }
}))
</script>

🎨 插件

  • @d-render/plugin-standard - 标准组件插件
  • @d-render/plugin-standard-configure - 配置面板插件

📄 许可证

MIT License

Related Packages

@done-coding/admin-core

配置驱动的 Vue 3 前端框架核心:表单、列表、表格、面板、布局组件族,一处配置多处...

13,943
lk-component-element

一个基于Element Plus封装的Vue3功能组件库

3,095
element-plus-generator

基于element-plus封装的表格、表单生成器

2,054
@rysharp/ry-table

基于 Vue3 + Element Plus 的低代码数据表格组件(列设置/筛选/新增编辑/打印/导出/手...

346
yy-dynamic-search-form

基于 Element Plus 的动态搜索表单组件

0

Version History

Version Released Vue License
3.2.3 ^3.4.34 MIT
3.2.1 ^3.4.34 MIT
3.2.0 ^3.4.34 MIT
3.1.21 ^3.4.34 MIT
3.1.20 ^3.4.34 MIT
Pre-releases (33)
Version Released Vue License
3.1.5-beta.2 ^3.4.34 MIT
3.1.5-beta.1 ^3.4.34 MIT
3.1.4-beta.2 ^3.4.34 MIT
3.1.4-beta.1 ^3.4.34 MIT
3.1.3-beta.2 ^3.4.34 MIT