【5.20213.824】flexGrid表格使用select方法的视图滚动的问题
请问我在react中使用wijmo的flexgrid组件,使用select方法,选中数据后,视图定位到表格最底部,有什么方法可以让视图滚动到视图居中的位置吗?这个是产品的设计就是这样,目前没有选项可以让选中行刚好在中间,你可以不加最后一个参数,这样只是单纯select而不会跳转
然后自己自己判断需要滚动到哪一行,通过scrollintoview方法滚动即可,
https://demo.grapecity.com.cn/wijmo/api/classes/wijmo_grid.flexgrid.html#scrollintoview “使用select方法,选中数据后,视图定位到表格最底部”具体的代码是什么? Richard.Ma 发表于 2024-11-1 11:53
“使用select方法,选中数据后,视图定位到表格最底部”具体的代码是什么?
import 'bootstrap.css';
import '@grapecity/wijmo.styles/wijmo.css';
import './app.css';
//
import * as React from 'react';
import * as ReactDOM from 'react-dom/client';
import * as wjGrid from '@grapecity/wijmo.react.grid';
import { ODataCollectionView } from '@grapecity/wijmo.odata';
import * as wjFilter from '@grapecity/wijmo.react.grid.filter';
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
flexGridRef: null,
customers: new ODataCollectionView("https://services.odata.org/Northwind/Northwind.svc", "Customers", {
sortOnServer: true,
filterOnServer: true
}),
itemCount: ""
};
}
render() {
return (<div className="container-fluid">
<p>{this.state.itemCount}</p>
<button onClick={this.handleJump}>跳转</button>
<wjGrid.FlexGrid itemsSource={this.state.customers} isReadOnly={true} initialized={this.flexInitialized.bind(this)}>
<wjFilter.FlexGridFilter />
</wjGrid.FlexGrid>
</div>);
}
flexInitialized(flexgrid) {
this.setState({
flexGridRef: flexgrid
})
flexgrid.loadedRows.addHandler(() => {
this.setState({
itemCount: flexgrid.rows.length + " items"
});
});
}
handleJump = () => {
if (this.state.flexGridRef) {
this.state.flexGridRef.select(20, 0, true)
}
}
}
setTimeout(() => {
const container = document.getElementById('app');
if (container) {
const root = ReactDOM.createRoot(container);
root.render(<App />);
}
}, 100);
樱花飞舞 发表于 2024-11-1 11:58
请见41行,奇怪贴不了图 详情请见贴图,谢谢
页:
[1]