Vue公司的應用程序不會加載

我有一個簡單的「Hello World」 VueJS的應用程序，我試圖讓工作：Vue公司的應用程序不會加載

<!doctype html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="https://unpkg.com/vue"></script>  
</head> 
<body>  
    <div id="app"> 
    Message: {{ message }} 
    </div>  
<script> 
    var vm = new Vue({ 
    el: "#app", 
    data: { 
     message: "Hello, world" 
    } 
    }); 
</script> 
</body> 
</html>

當我加載在瀏覽器中該文件，關閉我的本地磁盤（即：file：///home/user/vue-project/index.html），它會加載並顯示「Hello，world」。但是，如果我嘗試使用相同的文件並通過python容器開發服務器或通過gunicorn提供服務，則{{message}}呈現爲空白。

有誰知道什麼可能導致這種情況發生？

來源

2017-05-08 blindsnowmobile

你也許忘了gunicorn使用線程？變量並不總是通過gunicorn共享的！ – Luke

燒瓶使用'{{'和'}}來渲染變量....你需要配置vue來使用'[[message]]' –

燒瓶呈現其變量與使用{{ variable }}爲解析分隔符

render("mytemplate.html",message="Hello")將其替換所有{{ message }}塊Jinja2的「你好」任何JavaScript的處理之前......因爲你不定義消息，它只是一個空字符串...您將需要配置VUE使用替代分隔符（我用[[ message ]]）

<!doctype html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="https://unpkg.com/vue"></script>  
</head> 
<body>  
    <div id="app"> 
    Message: [[ message ]] 
    </div>  
<script> 
    var vm = new Vue({ 
    el: "#app", 
    delimiters = ['[[', ']]'], 
    data: { 
     message: "Hello, world" 
    } 
    }); 
</script> 
</body> 
</html>

來源

2017-05-08 00:38:12

Ack'等替代分隔符，當然。謝謝。 – blindsnowmobile

謝謝！只需提及，分隔符應該設置爲：分隔符：['[['，']]'] – Greg

Vue公司的應用程序不會加載

回答

相關問題