apeman-react-mixin-layout

apeman react package for layout mixin

Installation

$ npm install apeman-react-mixin-layout --save

Usage

#!/usr/bin/env node
 
'use strict'
 
import React from 'react'
import {ApLayoutMixin} from 'apeman-react-mixin-layout'
 
// Define own component with the mixin
const ExampleComponent = React.createClass({
  mixins: [
    ApLayoutMixin
  ],
  render () {
    const s = this
    let { layouts } = s // Detected layout
    return (
      <div style={ layouts.main }>{ /* ... */ }</div>
    )
  },
 
  // --------------------
  // For ApLayoutMixin
  // --------------------
 
  // Returns initial layout object
  getInitialLayouts () {
    return {
      main: { height: 100 }
    }
  },
 
  // Calc layout if needed
  calcLayouts () {
    let rect = document.getElementById('outer-dom').getBoundingClientRect()
    return {
      main: {
        height: rect.height + 20
      }
    }
  }
 
})
 

License

This software is released under the MIT License.

Links

• apeman
• apeman-react-labo
• React