[Vuejs]-Vue.js working with xml feed

0👍

You are getting the error because whatever processing you are doing, you should be doing in beforeMount, like following

  <script>
  var $ = require('jquery');

  export default {
      data () {
        return {
          title: ''
        }
      },
      beforeMount () {
        var self = this
        $(document).ready(function () {
         var feed = 'http://todayilearned.dk/feed.xml';
         $.ajax(feed, {
           accepts: {
             xml: 'application/rss+xml'
           },
           dataType: 'xml',
           success: function (data) {
             $(data).find('item').each(function () {
               var el = $(this);
               self.title = el.find('title').text()
               console.log('title      : ' + el.find('title').text());
               console.log('link       : ' + el.find('link').text());
               console.log('description: ' + el.find('description').text());
             });
           }
         });
       });
     }
 };

beforeMount is one of many Lifecycle Hooks provided by vue where you can access data, computed properties, and methods. You can also choose other hook based on your requirement.

data is where you define vue instance variable which can be used reactively in the template.

Leave a comment