VueJS не связывает внутри iframe

У меня есть код VueJs, который работал нормально, пока я решил поместить его в iframe, тогда он больше не привязывает данные.VueJS не связывает внутри iframe

это мой код:

HTML (GLOBAL)

<!DOCTYPE html> 
<html> 
    <head> 
    <title>title</title> 
    </head> 
    <body> 
    <div class="appbar"> 
     <iframe src="/auth"></iframe> 
    </div> 
    </body> 
</html>

IFRAME СОДЕРЖАНИЕ

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="bower/vue/dist/vue.min.js"></script> 
    </head> 
    <body id="auth"> 
    <div>{{foo}}</div> 
    <script src="js/auth.js"></script> 
    </body> 
</html>

JAVASCRIPT

var auth = new Vue({ 
    el: '#auth', 
    data: { 
     foo: "I'm a text but don't appear" 
    } 
})

И это то, что я получаю:

И Javascript, кажется, работает хорошо, когда я нажимаю на консоли auth.foo я получить правильное значение:

источник

2016-10-11 Burawi

Ваш код работает с использованием Vue 1.x. Я скопировал ваш код локально в .html-файлы, и он работал нормально. Я просто изменил тег сценария, чтобы указать на версию 1.x Vue на CDN.

Если вы используете Vue 2.x, вы больше не можете привязываться к элементу body. Добавьте div с кодом id и ваш код отлично работает в Vue 2.x:

<body> 
    <div id="auth"> 
     <div>{{foo}}</div> 
    </div> 
    <script src="js/auth.js"></script> 
    </body>

источник

2016-10-11 11:53:55 PatrickSteele

VueJS не связывает внутри iframe

ответ

Смежные вопросы