【5.20213.824】flexGrid表格使用select方法的视图滚动的问题

Richard.Ma

请问我在react中使用wijmo的flexgrid组件，使用select方法，选中数据后，视图定位到表格最底部，有什么方法可以让视图滚动到视图居中的位置吗？

Richard.Ma · Richard.Ma

这个是产品的设计就是这样，目前没有选项可以让选中行刚好在中间，你可以不加最后一个参数，这样只是单纯select而不会跳转

然后自己自己判断需要滚动到哪一行，通过scrollintoview方法滚动即可，
https://demo.grapecity.com.cn/wi ... html#scrollintoview

Richard.Ma · Richard.Ma

“使用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行，奇怪贴不了图

樱花飞舞 · 樱花飞舞

详情请见贴图，谢谢

		自动登录	找回密码
密码			立即注册

[已处理] 【5.20213.824】flexGrid表格使用select方法的视图滚动的问题

最佳答案

5 个回复

本帖子中包含更多资源

浏览过的版块

SpreadJS 认证

SpreadJS 高级认证

讲师达人

悬赏达人