jpmurray/gonewiththewind

包含Tailwind CSS组件的包，与默认的Laravel Tailwind UI兼容良好。

维护者

详细信息

github.com/jpmurray/GoneWithTheWind

源代码

问题

安装: 8

依赖: 0

建议: 0

安全: 0

星标: 1

关注者: 2

分支: 0

公开问题: 0

1.3.2 2021-01-02 18:52 UTC

Requires

MIT d42196cdfa8a0facd5d772ebf141e54235d61d3e

  • Jean-Philippe Murray <jp.woop@atomescroch.us>

componentslaraveltailwindtailwindcss

This package is auto-updated.

Last update: 2024-08-29 05:37:19 UTC

README

提供（我认为是）blade组件的包，这些组件与Laravel提供的（例如Breeze中的）基本Tailwind UI兼容良好。

这是为了尝试学习Tailwind。请注意，我并不是真的想学习它，我仍然希望直接使用Bootstrap！但我是一个原型设计师，我似乎不得不在我安排的时间中抽出一点时间，以便我可以随Laravel现在提供的默认设置“随风而去”。

组件和用法

卡片组件

表格

<x-with-wind-cards::table
    model="user"
    :data="$users"
    :show="['name']"
    :actions="['edit']"
/>

属性:

  • model要求传入单个模型名称以生成路由等（例如：`route('users.index')`）
  • data要求传入要显示在表格中的数据，与eloquent集合或分页集合配合良好。
  • show要求显示数据中的哪些列（例如：`['name', 'created_at']`）
  • actions默认为null，但如果提供，将添加一个带有指定操作的action列。目前支持['edit', 'delete']

表单组件

标签

<x-with-wind-forms::label for="name">Name</<x-with-wind-forms::label>

输入

<x-with-wind-forms::input id="name" type="text" name="name" :value="old('name')" required />

选择

<x-with-wind-forms::select id="type" name="type" autocomplete="type" :choices="['Label' => 'value']" chosen="value" />

属性:

  • choices要求传入一个关联数组，用于填充选择元素（`label => value`）
  • chosen要求在必要时选择哪个选项。

提交按钮

<x-with-wind-forms::submit>Save</<x-with-wind-forms::submit>