我在服务器端使用Spring Rest API,在客户端使用jersey API.
我正在创建一个屏幕,它将获取最后5个客户兑换交易.
从服务器端我返回RedeemTransactionDetails列表并在客户端接受相同的内容.
我调试了服务器端代码它返回有效列表,而在客户端响应代码是200,而获取实体我从客户端获得错误.
服务器端:
@RestController
@RequestMapping("/rest/api")
public class CustomerRestController {
@Autowired private CustomerService customerService;
@RequestMapping(value="/redeemTransactionList/{clientId}/{mobileNumber}/{numOfTransaction}" , method=RequestMethod.POST , produces = "application/json; charset=UTF-8")
public @ResponseBody List<RedeemTransactionDetails> redeemTransaction(@PathVariable(value = "clientId") int clientId, @PathVariable(value = "mobileNumber") String mobileNumber , @PathVariable(value="numOfTransaction") int numOfTransaction) {
LOG.debug("We are in redeemTransaction method for user {} " , clientId);
List<RedeemTransactionDetails> redeemList = null ;
try {
redeemList = customerService.redeemTransactionList(clientId, mobileNumber,numOfTransaction);
} catch (Exception e) {
LOG.debug("Excption while fetching redeemTransaction ");
}
return redeemList;
} …我是第一次使用Vue.js.我需要序列化django的对象
views.py
def articles(request):
model = News.objects.all() # getting News objects list
modelSerialize = serializers.serialize('json', News.objects.all())
random_generator = random.randint(1,News.objects.count())
context = {'models':modelSerialize,
'title' : 'Articles' ,
'num_of_objects' : News.objects.count() ,
'random_order' : random.randint(1,random_generator) ,
'random_object' : News.objects.get(id = random_generator ) ,
'first4rec' : model[0:4],
'next4rec' : model[4:],
}
return render(request, 'articles.html',context)
我试图在html中显示序列化的json数据,它的工作正常,
现在,如何在vue实例中初始化json数据并使用v-repeat属性在html中进行访问.
https://jsfiddle.net/kn9181/1yy84912/
请任何人帮忙???
我是 Vue.js 的新手。如何将 JSON 数据从 Django 视图传递到 vue 实例（方法）。
视图.py
def articles(request):
model = News.objects.all() # getting News objects list
random_generator = random.randint(1, News.objects.count())
context = {
'title' : 'Articles' ,
'modelSerialize' : serializers.serialize('json',News.objects.all()),
'num_of_objects' : News.objects.count() ,
}
return render(request, 'articles.html',context)
VueScript.js
new Vue({
el: '#list-Of-Articles-Displayed',
data: {
count: 0
},
ready: function() {
this.$http.get('http://127.0.0.1:8000/article/').then(function (response) {
response.status;
console.log(response);
}, function (response) {
alert("error ");
// error callback
});
}
})
模板（文章.html）
<div id = "list-Of-Articles-Displayed" class = "col-lg-10" …