反応データグリッドsetScrollLeftは関数ではありません - 固定列が動作しない - カスタム行レンダラー

Question

固定列を私のreact-data-gridに実装しようとしています。 exampleの後にlocked: trueを追加しても動作しませんので、other exampleのようにレンダリングされたカスタム行を使用しようとします。

_this.refs[i].setScrollLeft is not a functionエラーが発生します。 this same questionのハッキーなコメントを試しても私にとってはうまくいきません。

私もcreate a custom cell render classにしようとしましたが、まだ運がありません。 私はまた、代わりにコールバック方法をrefs使用しよう：

class CellRenderer extends React.Component {  
    render() { 
    return <ReactDataGrid.Cell {...this.props}/> 
    } 
}; 

class RowRenderer extends React.Component { 
    static propTypes = { 
    idx: React.PropTypes.string.isRequired 
    }; 

    setScrollLeft = (scrollBy) => { 
    // if you want freeze columns to work, you need to make sure you implement this as apass through 
    this.row.setScrollLeft(scrollBy); 
    }; 

    getRowStyle =() => { 
    return { 
     color: this.getRowBackground() 
    }; 
    }; 

    getRowBackground =() => { 
    return this.props.idx % 2 ? 'green' : 'blue'; 
    }; 

    render() {return (<div style={this.getRowStyle()}> 
     <ReactDataGrid.Row 
     {...this.props} 
     ref={r => { this.row = r; }} 
     cellRenderer={CellRenderer} 
     /> 
    </div>); 
    } 
}; 

をすべてのヘルプははるかに高く評価されます！

EDIT：多くのことを試してもまだ運はありませんが、setScrollLeftメソッドがコンポーネントに渡されることはありません。したがって、おそらくrefsやpropsに問題があるかもしれません。

Answer 1

「固定」列の意味を100％確信しているわけではありませんが、ソフトウェアによって設定され、ユーザーによって変更されないようにするには、単にresizable = falseを設定します。列に「locked」= trueを設定すると、列をフリーズする効果があります。スクロールすると、その特定の列がそこに残りますが、これはおそらく必要ではありません。