myxvisual / react-uwp

📱⌨ React Components that Implement Microsoft's UWP Design & Fluent Design.
https://react-uwp.com
MIT License
1.18k stars 78 forks source link

SplitViewCommand may lose attributes in create #77

Open PitterL opened 5 years ago

PitterL commented 5 years ago

Describe the bug I intend to add onClick event in NavigationView, which uses SplitViewCommand as it children elements. So it will be like this as the examples:

const navigationTopNodes =
      items.map(item => {
        return <SplitViewCommand icon={item.icon} label={item.label} onClick={()=>{console.log("<NavigatorBar> onClick", item.label)}}/>  
      });
...
<NavigationView
          ....
          navigationTopNodes={navigationTopNodes}
         ....
        >
          <SplitViewPane />
</NavigationView>  

But it not working, so i trace the code here in SplitViewCommand:

in SplitViewCommand.prototype.render = function () {
....
return (React.createElement(PseudoClasses_1.default, __assign({}, rootStyleClasses),
            React.createElement("div", __assign({}, attributes),
                (visited && !isTenFt) ? React.createElement("div", __assign({}, visitedBorderStyleClasses)) : null,
                React.createElement(Icon_1.default, __assign({}, iconStyleClasses), icon),
                label && (React.createElement("div", __assign({}, labelStyleClasses), label)))));
}:

the "onClick" props set as "rest attributes" ans applied to 2nd level div, I'm not sure what this used, but it not work for the answer the click event. So I tried move the "rest attributes" of the root div, it's working:

return (React.createElement(PseudoClasses_1.default, __assign({attributes}, rootStyleClasses),
            React.createElement("div", __assign({}, /*attributes*/{}),
                (visited && !isTenFt) ? React.createElement("div", __assign({}, visitedBorderStyleClasses)) : null,
                React.createElement(Icon_1.default, __assign({}, iconStyleClasses), icon),
                label && (React.createElement("div", __assign({}, labelStyleClasses), label)))));

Expected behavior onClick event working for NavigationView

Desktop (please complete the following information):

Additional context I also see the onMouseEnter and onMouseLeave props are also not used here?

Thanks.