svelte-flex - A simple and reusable flexbox component for Svelte

栏目: IT技术 · 发布时间: 6年前

内容简介:A simple and reusable flexbox component forThis package is available on NPM, and you can install it with

svelte-flex

:muscle: A simple and reusable flexbox component for Svelte.

A simple and reusable flexbox component for Svelte .

  • Sane defaults.
  • Simple API.
  • Reactive props.
  • Minimal size.

Try me on CodeSandbox!

Installation

This package is available on NPM, and you can install it with npm or yarn :

npm install svelte-flex

yarn add svelte-flex

Usage

Import the Flex component and use it in your Svelte project.

<script>
  import Flex from 'svelte-flex';
</script>

<Flex>
  <div>Flexbox child!</div>
  <div>Flexbox child!</div>
  <div>Flexbox child!</div>
</Flex>

Props

All props are optional (as they all have default values).

Prop Possible Values Default Value
direction 'row' | 'column' 'row'
align 'start' | 'center' | 'end' | 'stretch' 'center'
justify 'start' | 'center' | 'end' | 'around' | 'between' | 'evenly' 'center'
reverse true | false false

Check out the test suite if you're unsure what CSS styles are applied by these props.

The props are reactive, meaning that if they are dynamically updated, the component will update in response.

Contributing

Feel free to file an issue or open a pull request. Ensure that you add tests for any new functionality.

:ok_hand: Built by Dave Lunny .


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

Android编程权威指南

Android编程权威指南

[美] Bill Phillips、[美] Brian Hardy / 王明发 / 人民邮电出版社 / 2014-4 / CNY 99.00元

权威、全面、实用、易懂,是本书最大的特色。本书根据美国大名鼎鼎的Big Nerd Ranch训练营的Android培训讲义编写而成,已经为微软、谷歌、Facebook等行业巨头培养了众多专业人才。作者巧妙地把Android开发所需的庞杂知识、行业实践、编程规范等融入一本书中,通过精心编排的应用示例、循序渐进的内容组织,以及循循善诱的语言,深入地讲解了Android开发的方方面面。如果学完一章之后仍......一起来看看 《Android编程权威指南》 这本书的介绍吧!

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

XML 在线格式化
XML 在线格式化

在线 XML 格式化压缩工具

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换