SPFx ListView control - "defaultSelection" does not work

Question

I'm using a ListView control from @pnp/spfx-controls-react library version 2.5.0

There is a documented property called defaultSelection which is:

The index of the items to be select by default

I'm trying to use it like this to autoselect the first row of the table:

          <ListView
            items={this.state.items}
            viewFields={this._viewFields}
            selectionMode={SelectionMode.single}
            selection={this._updateSelectedItems}
            defaultSelection={[0]}
          />

But when the page loads it never selects anything. Also no errors in the console.

I've also used a bare example found here: https://github.com/RaspeR87/sp-dev-fx-webparts/tree/master/spfx-react-controls/ListView to try it on a simple project but again it never selects anything.

Did anyone manage to make use of this property? Every input appreciated.

Answer 1

Yes, I have the same test result as yours. You may post this issue in the PNP react control Github repository.https://github.com/pnp/sp-dev-fx-controls-react/issues

Answer 2

Here is a hack to solve the problem:

// Add a useRef to your ListView control
const refListView = useRef<any>(null);

// Set selection on load
useEffect(() => {
       
    // Set mySelection as default selection
    const mySelection = [1,4,6];
    mySelection.forEach(i => {
        setTimeout(() => {
            refDocs.current._selection.setIndexSelected(i, true, false);
        }, 0);
    });

}, []);

// ListView control
<ListView ref={refListView }...