前端代码:
<script src="~/Js/jquery-3.3.1.min.js"></script>
???<script src="~/Js/vue.js"></script>
</head>
<body>
???<div>
???????<div id="vue_det">
???????????<ul v-for="mess in message">
???????????????<li>{{mess.Code}}</li>
???????????????<li>{{mess.EnName}}</li>
???????????????<li>{{mess.Name}}</li>
???????????????<li>{{mess.Level}}</li>
???????????</ul>
???????</div>
???</div>
???<script type="text/javascript">
???????var vm = new Vue({
???????????el: ‘#vue_det‘,
???????????data: {
???????????????message: []
???????????}
???????})
???????$(function () {
???????????$.ajax({
???????????????type: "POST",
???????????????url: "/Home/xml",
???????????????data: "",
???????????????success: function (aaa) {
???????????????????console.log(aaa);
???????????????????vm.message = aaa;
???????????????}
???????????})
???????})
???</script>
</body>
</html>
控制器代码:
private static List<Domain> domains;
???????public static List<Domain> Domains
???????{
???????????get
???????????{
???????????????if (domains == null || domains.Count <= 0)
???????????????{
???????????????????domains = new List<Domain>();
???????????????????XmlDocument doc = new XmlDocument();
???????????????????doc.Load(HttpRuntime.BinDirectory + "/Resourse/Domains.xml");
???????????????????foreach (XmlNode node in doc.DocumentElement.ChildNodes)
???????????????????{
???????????????????????Domain l = new Domain();
???????????????????????l.Code = Convert.ToInt64(node.Attributes["code"].Value);
???????????????????????l.Name = node.Attributes["name"].Value;
???????????????????????l.EnName = node.Attributes["enname"].Value;
???????????????????????l.Level = Convert.ToInt32(node.Attributes["level"].Value);
???????????????????????l.Demo = node.InnerText;//子节点中的text
???????????????????????domains.Add(l);
???????????????????}
???????????????}
???????????????return domains;
???????????}
???????}
???????public JsonResult xml()
???????{
???????????return Json(Domains);
???????}
简单的Ajax请求,返回Json //xml文件内容
MVC模式简单的Xml文档解析加Vue渲染
原文地址:https://www.cnblogs.com/ybbb/p/8953599.html