Gets the JSON data from the database, and the front end is bound with vue.js data __oracle

function Userinfor () {
	$.get ("http://127.0.0.1:8082/lzghcg/user/userShows",
			function (result, state) {
				This shows the data returned from the server
				new Vue ({
					el: ' #userinfor ',
					data:{//data is data, primary bound data
						Lists:result
					}
				}) //
				This shows the returned status
				/alert (state);
				 
		/*dynamictable (Result) */
	
	})
}

When using Vue, you must create a Vue object.

El is the main rendering to where, is the HTML CSS ID meaning.

Data: That's what you want to render, JSON data.

The main use is the V-text command.

What about this instruction? V followed by something similar to a method. Website has introduced.

It's up to the front desk for the binding data.

This time, we need to use a v-for

What about looping statements in Vue?

<tbody id = "Userinfor" > <tr v-for= "list in lists" > <td width= "30px" align= "center" >&lt ; Input type= "checkbox" name= "checkbox"/style= "margin:0px" ></td> <td v-text= "List.usern" Ame "></td> <td v-text=" List.memo "></td> </tr> & lt;tr> <td width= "30px" align= "center" ><input type= "checkbox" name= checkbox "/style=" margin:0px "></td> <td>admin</td> <td>123</td> <td&gt ;3</td> <td><span class= "redtitle" title= "Delete topic" onclick= "" > Edit </span> &LT;SP
											An class= "Redtitle" title= "Delete topic" onclick= "" > Delete </span></td> </tr> <tr> &LT;TD width= "30px" align= "center" ><input type= "checkbox" name= "checkbox"/style= "margin:0px"
											;</td><td>lee</td> <td>1</td> <td>3</td> <td><span class= "Redtitle" title= "Delete issue" onclick= "" > Edit </span> <span class= "redtitle" title= "Delete topic" onclick= "" > Delete </span></td> </tr> </tbody>

Red is the key, but I do this when the binding is no problem, it is estimated to encounter a problem, is the simplest binding data, will appear to load your page before the call to Vue.js to help you bind. Because I'm using AJAX to get the data, the bindings. Cannot bind with {{}} this format. only to use V-text.

Here's an example of a failure.

	<!--<div id= "userinfor" >
									<ul><li v-for= "list in lists" >
									
									{list.username}}
									
									</li ></ul>
									
									
									</div>-->

Instead the page will appear with a

{{List.username}}}

This thing, after a while will be worth appearing.

I don't know how to solve it. Finally, I introduced how I go to the Java background to deal with the value inside, look at the good ha ha ha

var newvuedate = null;
function DynamicTable (Result) {
	var data = result;//Fetch a JSON data
	if (data = = null) {return
		;
	}
	
	var datavue = [];
	for (var i = 0; i < data.length i++) {//json is similar to an array, so through the loop output
var objproject = {
			"id": result[i].id,//this is assigned to An array object inside, the development time is to take the value inside to make a logical judgment, what to do. This also adds his subscript
			"username": result[i].username,/I can give an example to see Tomorrow
			"password": Result[i].password,
			"CreateDate ": Result[i].createdate,
			" dele ": Result[i].dele,
			" Memo ": Result[i].memo
		}
		Datavue.push ( objproject);
	}
	if (newvuedate = = null) {
		newvuedate = new Vue ({
			el: ' #userinfor ',
			data: {
				Lists:datavue
			}
  });
	else {
		newvuedate.lists = Datavue
	}

}

This is the initialization of Vue things, the Great God told me, why not tied up, is not yet initialized Vue do not know is not so.