Vue.js ‘$remove’ method

$remove is a handy internal method of Vue.js to remove an element in an array. This method is pretty much just calling the splice() function, but reducing the number of lines of code.

Example: https://jsfiddle.net/jpv056o2/


this.yourArrayName.$remove(elementIndex)

Advertisements

Differences in syntax between AngularJS, Angular2, React, and Vue.js

(by AXDS)

Here’s some examples showing the differences in syntax between AngularJS, Angular2, React, and Vue.js  🙂

All of these examples are doing pretty much the same thing:

AngularJS: https://jsfiddle.net/g7bk9Lk5/

Angular2: https://jsfiddle.net/pt5ox9mp/

React: https://jsfiddle.net/ma9bg0gt/

Vue.js: https://jsfiddle.net/2ojtoaxx/

 

 

 

Vue.Js Components

Testing how components work in Vue.Js

Simple Example: https://jsfiddle.net/4v6khn77/

var Testing_Component = Vue.extend({
template: 'Hello World'
});

var mainViewModel = new Vue({
el: '#myApp',
components: {
'testing-component': Testing_Component
}
});

Component inside list Example: https://jsfiddle.net/3d91z7pe/


var Person_Component = Vue.extend({
template: '
	<li style="color:{{ color }}">{{ foreName }} {{ lastName }}</li>
'
});

var listOfPeople = [{
foreName: 'Wade',
lastName: 'Wilson',
color: 'red'
}, {
foreName: 'Peter',
lastName: 'Parker',
color: 'blue'
}];

var mainViewModel = new Vue({
el: '#myApp',
data: {
peopleList: listOfPeople
},
components: {
'person-component': Person_Component
},
template: '
<ul><person-component v-repeat="peopleList"></person-component></ul>
'
});