Last active
January 27, 2017 03:54
-
-
Save RDelorier/b2a0fee8d320926d8336 to your computer and use it in GitHub Desktop.
Vue js filter to use with select options
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//js | |
users = [ | |
{ name:'foo', id:1 }, | |
{ name:'bar', id:2 }, | |
{ name:'baz', id:3 } | |
]; | |
//html | |
<select | |
v-model="user.id" | |
options="users | toSelect 'name' 'id'"> | |
</select> | |
//outputs | |
<select> | |
<option value="1">foo</option> | |
<option value="2">bar</option> | |
<option value="3">baz</option> | |
</select> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict'; | |
/** | |
* | |
* @param collection to map | |
* @param text index of visible text from | |
* @param value index of value | |
* @returns array | |
*/ | |
var toSelect = function(collection, text, value){ | |
return collection.map(function(e){ | |
return { | |
text: e[text], | |
value:e[value] | |
} | |
}) | |
}; | |
require('vue').filter('toSelect', toSelect); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment