I am new to vue and I want to use in SharePoint to render a table from my list data. I’ve got the code working to the point of getting data from rest api using jquery ajax. I am stuck on how to render the list data into a table.
The columns in my list are “Email”,”First Name”, “Last Name”, and “Phone”. This is my very first time trying to use vuejs in SharePoint so I’m really not sure how to proceed once I’ve gotten my data. Any help would be appreciated. Below is my code:
</head> <body> <div id="app"> {{ fieldNames }} {{ status }} </div> <script type="text/javascript" src="https://unpkg.com/vue@2.0.3/dist/vue.js"></script> <script> new Vue({ el: "#app", data: { fieldNames: "HELLO SharePoint 2013", status: '', columnNames: ["Email","First Name", "Last Name", "Phone"], columnData: [] }, created: function(){ this.getListData(); }, methods: { getListData: function(){ var endPointUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbyTitle('siteAdmins')/items"; var headers = { "accept": "application/json;odata=verbose" }; this.status = "getting data..."; var vm = this; jQuery.ajax({ url: endPointUrl, type: "GET", headers: headers, success: function (data) { console.log(data); vm.generateData(data); } }) }, generateData: function(d){ alert("generateData"); //<-- This works but not sure what to do next } } }); 
