add reactive array swap
See original GitHub issueI am writing a simple todo list component with:
Vue.component('todo-list', {
props: ['todos'],
template:
`<ol>
<li v-for="(td, ix) in todos">
{{td}}
<button title="delete" @click="todos.splice(ix,1)">X</button>
<button title="move up" @click="todos.swap(ix,ix-1)" v-show="ix>0">^</button>
</li>
</ol>`,
})
For this to work I need (in core/observer/array.js) something like:
Array.prototype.swap = function(x,y) {
var t = this[x]
this[x] = this[y]
this[y] = t
}
const arrayProto = Array.prototype
export const arrayMethods = Object.create(arrayProto)
/**
* Intercept mutating methods and emit events
*/
;[
'push',
'pop',
'shift',
'unshift',
'splice',
'swap', // added
'sort',
'reverse'
]
It works when I (lazily) fixed dist/vue.js, but did not run the tests. I think it is worth to add swap this way because notify() is run just once, am I wrong?
Issue Analytics
- State:
- Created 7 years ago
- Comments:10 (6 by maintainers)
Top Results From Across the Web
Implementing a function to swap array elements in React ...
I am coding a react app in which a user can click a button to swap an item in an array with the...
Read more >Reactivity in Depth - Vue.js
When you directly set an item with the index, e.g. vm.items[indexOfItem] = newValue; When you modify the length of the array, e.g. vm.items.length...
Read more >On-demand Reactivity in Vue 3 - Toptal
If we're adding a reactive variable, we insert it in the data section. If we're looking for an existing variable, we know it...
Read more >Vue 3 Reactivity Basics - Medium
Vue 3 adds the necessary abstraction on JS Proxy and makes it native and simple. ... The reactive conversion is “deep” — it...
Read more >Array.push() won't update Lightning Web Component View
@pmdartus I've added a similar question on lightning-accordion array.push() which has reproducible Playground code.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Why not just write
https://jsfiddle.net/L92w2372/2/
updated for notification only once
In this case, they are., as we are changing an array.
Contreibution welcome.
I will close this issue now, since I think we have come to an understanding that this won’t be added to core.