springboot vue sample32
◆controller
package com.example.demo2;package com.example.demo2;
import java.util.ArrayList;import java.util.List;
import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RestController;
@RestController@RequestMapping("/api/twitter")public class MessageController2 { private List<Friend> friends;
MessageController2(){ friends = new ArrayList<Friend>(); friends.add(new Friend("ado", "tuo ado")); friends.add(new Friend("yoru", "yoruno ado")); } @GetMapping("/aa") public List<Friend> list() { return friends; } @GetMapping("/{id}") public Friend get(@PathVariable String id) { return friends.parallelStream().filter(f -> id.contentEquals(f.getId())).findAny().orElse(null); }
}
◆index.html
<!DOCTYPE html><!DOCTYPE html><html><head> <meta charset="UTF-8"> <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> <title>spring tweets</title> </head><body>
<div id="app"> <h1>Spring Tweets!</h1> <ul> <li v-for="friend in friends" @click="showFriend(friend)">{{ friend.id }}</li> </ul> <div class="details" v-show="showDetails"> <h2>Friend Details</h2> <p> <a href="'https://yen.red/' + selectedFriend.name" target="_blank"> @{{ selectedFriend.id }} </a> </p> </div></div>
<script> const apiURL = "http://192.168.10.103:8080/api/twitter/aa"; new Vue({ el: '#app', data() { return { friends:[], showDetails: false, selectedFriend: '' } }, methods: { showFriend(friend){ this.selectedFriend = friend; this.showDetails = true; } }, created() { fetch(apiURL) .then(response => { return response.json(); }) .then(friends => { this.friends = friends; }) } });</script>
</body></html>
◆model
package com.example.demo2;package com.example.demo2;
public class Friend {
public String id; public String name; Friend(String id, String name){ this.id = id; this.name = name; } public String getId() { return id; } public void setId(String id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } @Override public String toString() { return "Friend [id=" + id + ", name=" + name + "]"; } }
ーーーーーーーーーーーーーーーーーーーーーーーーー
