https://github.com/webkixi/aotoo-react-tabs

基于aotoo, react的tabs组件
https://github.com/webkixi/aotoo-react-tabs

Last synced: 1 day ago
JSON representation

基于aotoo, react的tabs组件

• Host: GitHub
• URL: https://github.com/webkixi/aotoo-react-tabs
• Owner: webkixi
• License: mit
• Created: 2017-07-07T08:54:21.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2023-01-12T09:59:42.000Z (almost 2 years ago)
• Last Synced: 2024-02-27T19:22:27.212Z (9 months ago)
• Language: JavaScript
• Size: 97.7 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# aotoo-react-tabs

## Install

```bash

# install

yarn add aotoo-react-tabs

```

## USAGE  

Depends on aotoo this library, `Aotoo` is a global variable

```jsx

import aotoo from 'aotoo'

require('aotoo-web-widgets')

require('aotoo-react-tabs')

const WrapElement = Aotoo.wrap( 
这个真好吃
, {

  rendered: function(dom){ /* after reactDom didMounted then ... */ },

  leave: function(){ /* before reactDom will be unmounted then ..*/ }

})


const tabs = Aotoo.tabs({

  props: {

    tabClass: 'tabs-nornal-top',

    data: [

      {title: 'aaa', content: '什么, what'},

      {title: 'bbb', content: '来了'},

      {title: 'ccc', content: },

    ]

  }

})

tabs.render('id')  // reader tabs to some dom with id

// cosnt xxx = tabs.render() ====> it's a jsx

```

## API  

#### $update(opts)

```jsx

// ======== or full replacement

tabs.$update({

  data: [

    {title: 'one', content: 'abcccc'},

    {title: 'two', content: 'uuuyyy'},

    ...

  ]

})

```

The above operation causes the structure to be re-rendered and the callback method `rendered` is executed again  

#### $select(index)

```jsx

tabs.$select({ select: 2 })

``` 

access the above operation, you can dynamically append the structure after you append the data(_data)