feat: custom operation support sortablejs method

lijinke666 · Feb 8, 2021 · 939d453 · 939d453
1 parent 52c3159
commit 939d453
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 5 deletions.
diff --git a/README.md b/README.md
@@ -130,7 +130,7 @@ ReactDOM.render(
 ## :clipboard: API
 
 | Name | Type | Default | Description |
-| ---- | ---- | ------- | ----------- |
+| --- | --- | --- | --- | --- | --- | --- |
 | className | `string` | `-` | Additional CSS class for the root DOM node |
 | audioLists | [AudioListProps[]](#bulb-audiolistprops) | `-` | [Detail](#bulb-audiolistprops) |
 | theme | `light` \| `dark` \| `auto` | `dark` | color of the music player theme `dark`, `light`, `auto (follow system)` | `light` |
@@ -223,6 +223,7 @@ Support feature:
 - `play prev audio`
 - `play audio by custom play index`
 - `update play index`
+- [SortableJS methods](https://github.com/SortableJS/Sortable#methods)
 
 ```jsx
 class App extends React.Component {
@@ -280,8 +281,8 @@ class App extends React.Component {
 ```
 
 <p>
-<img alt="glass-1" src="https://github.com/lijinke666/react-music-player/blob/master/assetsImg/glass-1.png" width="200" max-width="49%">
-<img alt="glass-2" src="https://github.com/lijinke666/react-music-player/blob/master/assetsImg/glass-2.png" width="200" max-width="49%">
+<img alt="glass-1" src="https://github.com/lijinke666/react-music-player/blob/master/assetsImg/glass-1.png?raw=true" width="200" max-width="49%">
+<img alt="glass-2" src="https://github.com/lijinke666/react-music-player/blob/master/assetsImg/glass-2.png?raw=true" width="200" max-width="49%">
 </p>
 
 ## :bulb: Custom downloader
@@ -526,7 +527,7 @@ export interface ReactJkMusicPlayerIcon {
 <ReactJkMusicPlayer theme="auto" />
 ```
 
-![auto-theme](https://github.com/lijinke666/react-music-player/blob/master/assetsImg/auto-theme.gif)
+![auto-theme](https://github.com/lijinke666/react-music-player/blob/master/assetsImg/auto-theme.gif?raw=true)
 
 ## :bulb: Quiet update
 

diff --git a/index.d.ts b/index.d.ts
@@ -50,6 +50,7 @@ export interface ReactJkMusicPlayerInstance extends HTMLAudioElement {
     fromIndex: number,
     audioLists: ReactJkMusicPlayerAudioListProps[],
   ) => void
+  sortable?: any
 }
 
 export interface ReactJkMusicPlayerIcon {

diff --git a/src/index.js b/src/index.js
@@ -2157,6 +2157,10 @@ export default class ReactJkMusicPlayer extends PureComponent {
         name: 'appendAudio',
         value: this.appendAudio,
       },
+      {
+        name: 'sortable',
+        value: this.sortable,
+      },
     ].forEach(({ name, value }) => {
       Object.defineProperty(audio, name, {
         value,
@@ -2423,7 +2427,7 @@ export default class ReactJkMusicPlayer extends PureComponent {
     this.addMobileListener()
     this.addSystemThemeListener()
     this.initPlayer()
-    this.onGetAudioInstance()
     this.initSortableAudioLists()
+    this.onGetAudioInstance()
   }
 }