vue js массив и список
Добрый день! Подскажите...
есть массив в таком ввиде (из консоли) 0: {events_id: "1", events_client_id: "1123", events_title: "123", events_description: null, events_worker_id: null, …} 1: {events_id: "2", events_client_id: "2", events_title: "123", events_description: null, events_worker_id: null, …} и т.д. как его запихнуть в vuejs и отображать список напишите пару примерчиков!!! перерыл весь инет...везде все в явном ввиде указано!!!((((( Заранее спасибо! |
Sergey1986,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
</head>
<body>
<div id="app">
<ul>
<li v-for="el of ar">
<div v-for="(value, key) of el">{{key}} : {{value}}</div>
</li>
</ul>
</div>
<script>
const app = new Vue({
el: "#app",
data: {
ar: [{events_id: "1",events_client_id: "1123"},{events_id: "2",events_client_id: "2"}]
}
});
</script>
</body>
</html>
|
Может, что-то вроде этого?
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
</head>
<body>
<div id="app">
<ul>
<li v-for="el in ar">
{{ stringValues(el) }}
</li>
</ul>
</div>
<script>
var arrTest = [{events_id: "1", events_client_id: "1123", events_title: "123", events_description: null, events_worker_id: null},{events_id: "2", events_client_id: "2", events_title: "123", events_description: null, events_worker_id: null}];
const app = new Vue({
el: "#app",
data: {
ar: arrTest
}
});
function stringValues(obj) {
var str = "";
for (key in obj) {
str += " " + obj[key];
}
return str;
}
</script>
</body>
</html>
|
Dilettante_Pro,
:)
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
</head>
<body>
<div id="app">
<ul v-for-object>
<li v-for="el in ar">
<span v-for="v in el">{{ v+"" }} </span>
</li>
</ul>
</div>
<script>
var arrTest = [{events_id: "1", events_client_id: "1123", events_title: "123", events_description: null, events_worker_id: null},{events_id: "2", events_client_id: "2", events_title: "123", events_description: null, events_worker_id: null}];
const app = new Vue({
el: "#app",
data: {
ar: arrTest
}
});
</script>
</body>
</html>
|
Всем спасибо! буду пробыать! (хотя проглядел все это, ведь и я так и дела как по документации..ю!
|
| Часовой пояс GMT +3, время: 02:33. |