JSFiddle - React, Tailwind, and code Playground

by ksumarine

HTML

<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.11.10/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/linq.js/2.2.0.2/jquery.linq.min.js"></script>
CURRENT RESULT
<ul id="test">
	<li v-repeat="dta">{{$value}}</li>
</ul>

DESIRED RESULT
<ul>
	<li>user1</li>
	<li>user2</li>
	<li>user3</li>
	<li>user4</li>
</ul>

JavaScript

var list = [
	{id:1, name:'test', seenby:'user1, user2, user3'},
	{id:2, name:'test1', seenby:'user3, user4'},
	{id:3, name:'test2', seenby:'user1, user3'},
	{id:4, name:'test3', seenby:'user2'}
];

var arr = $.Enumerable.From(list)
	.Distinct('$.seenby')
	.OrderBy('$.seenby')
	.Select('$.seenby')
	.ToArray();
	
var vue = new Vue({
	el: '#test',
	data: {
		dta:arr
	}
})

console.log(JSON.stringify(arr));
// this will just return the seenby column all together. I want to
// distinctly split the comma delimited strings into their own index.
// ["user1, user2, user3","user1, user3","user2","user3, user4"]