Comments (12)
Hi,
I'm sure fritz-c can elaborate here, but as far as I know you would need to create your own noderenderer to disable the moving functionality. Check out the nodeContentRenderer option.
As for adding buttons, check out the generateNodeProps option and how this is configured in the included example (src/examples/basicExample/app.js)
from react-sortable-tree.
Thank you @larsts.
As larsts said, the example code is a good place to look for the button adding example.
As for disabling moving, I don't have an official way to do it, but the hack explained here might do what you want for now: #14 (comment)
from react-sortable-tree.
By the way I have written a typescript definition for your library, so should I make a pull request for you then? Also @fritz-c do you mind let me write the disabling moving for you, perhaps I could clone your repository and then write up a new prop of enable/disable the handle bar.
Also for the length of individual tree node if the text is too long would it wrap? I have tested but I find that it is not able to do so.
from react-sortable-tree.
I've not used typescript before, so I'm not exactly sure how it works, but if it will benefit other users of the library I'll merge it in.
As for the move disabling, I would be interested in adding a new prop for it. A moveDisabled
prop that disables the rendering of the handle (and adds an extra rowContentsMoveDisabled
class to replace the missing border on the left side of the node) is basically what I had in mind.
Text wrapping is not possible right now, at least not in the automatic, browser-handled sense. If you made the rowHeight
prop tall enough, and added <br />
or some sort of pre
style to your text, you could pull it off, but automatic resizing due to height is disabled in favor of using react-virtualized. If you search "react-virtualized" in the issues you can find a few discussions on this matter.
from react-sortable-tree.
So now for the typescript definition should I make a pull request then?
from react-sortable-tree.
Sure, that would be great!
from react-sortable-tree.
Thanks Chris. So I assume that I would firstly fork your project and then add the relevant typescript definitions to a new folder and then compare to your master branch making a pull request, is that right?
from react-sortable-tree.
I'm not sure how typescript definitions work, so I can't comment on the folder part of it, but the rest of that regarding the pull request is correct.
from react-sortable-tree.
Hi,
is the moveDisabled props is added in the latest release?
from react-sortable-tree.
This functionality is now available with the canDrag
API in version 0.1.14.
from react-sortable-tree.
Is there a way to disable the specific nodes only rather than disabling the drag on entire tree
from react-sortable-tree.
Is there a way to disable the specific nodes only rather than disabling the drag on entire tree
My case was only disabled on the root node, and I used it as below
<SortableTree
{...props}
canDrag={({treeIndex) => treeIndex>0}
/>
from react-sortable-tree.
Related Issues (20)
- How to use props with redux ? HOT 1
- React version dependency issue HOT 5
- how to make search nodes only starting from one node which we clicked ?
- Is it possible to make the react sortable tree ui less big with a setting : sm, md, bg ?
- React dnd upgrade HOT 2
- How to customize move handler? 🤔 HOT 2
- div is fadeout when drag
- Insert node at specific index under parent node.Iindex HOT 1
- It is possible to use a node as ReactRef() ? HOT 1
- Give Children another label/property name
- Failed to minify the code error HOT 2
- getTreeFromFlatData set rootKey as null
- Support multiple dragging
- Option to snap automatically to nearest possible level HOT 1
- Support React 18 HOT 1
- new child is added to the parent when collapsing the parent HOT 1
- Using the react-sortable-tree in react 18 HOT 4
- is it possible to display the tree as a vertical tree diagram?
- About maintenance of this library
- Could not resolve dependency: React 18 with [email protected] HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-sortable-tree.