Loading External Page into a DIV using VueJS

You can use the triple braces to render actual HTML or even use the v-html attribute.

Make an XHR request to load the data and populate a data variable that will fill your div.

@Francismori7 Thank you for the anser, I'd be happy if you can provide me of an example, since I'm new to VueJs

Vue alone does not have tools to send/receive data. So if you've already got jquery loaded on the page, use it. otherwise you'll need to use either vanilla javascript or another js library to fetch that remote page/data to populate onto your page.

@AkiyamaSmart

Your browserify entry file:

import Vue from 'vue';

Vue.use(require('vue-resource'));

new Vue({
    el: 'body',

    data: {
        html: '<p>Loading...</p>'
    },
    
    ready() {
        this.$http.get('/route').then(response => {
            this.html = response.data;
        });
    }
});

Your page:

<div v-html="html"></div>

Command-line:

npm install --save-dev vue vue-resource
gulp

Untested.

Is there any way to load a different website within my app in vue JS? the iframe doesnt work for chrome, I m looking for something that is compatible with all browsers.