PHP smartyテンプレートとVue.jsを統合するには？

AmはPHPでSmartyのテンプレートエンジンで作業し、自分のアプリケーションにVUE.jsを統合したいが、Smartyのは（ダブル中括弧）Vue.js構文を理解していないように思えるPHP smartyテンプレートとVue.jsを統合するには？

コードの下：

home.tplの

{include file="partials/header.tpl" title="Home"} 
<body data-spy="scroll" data-target=".navbar"> 
    <div class="se-pre-con"></div> 

    {include file="partials/navbar.tpl"} 

    <div class="container container-body"> 
     <div class="row"> 
      <div class="col-md-12" id="app"> 
       <h2>Test Heading</h2> 
       {{ message }} 
      </div> 
     </div> 
    </div> 
{include file="partials/footer.tpl"}

footer.tpl

<script src="https://unpkg.com/vue"></script> 
<script src="resource/js/app.js"></script>

app.js

var app = new Vue({ 
    el: '#app', 
    data: { 
    message: 'Hello Vue!' 
    } 
})

エラーメッセージ：

Fatal error: Uncaught --> Smarty Compiler: Syntax error in template "file:\resource\html\templates\home.tpl" on line 11 "{{ message }}" - Unexpected "{ " <-- thrown in vendor\smarty\smarty\libs\sysplugins\smarty_internal_templatecompilerbase.php on line 11

すべてのヘルプは高く評価されます。おかげ

出典

2017-06-09 Zeeshan

とhome.tplラップmessageにあなたはがこのhttps://stackoverflow.com/a/12738181/6611700 をチェックする必要がありますリンクされた答えは角度のため、同じことがanyJSレンダリング/解析ライブラリに適用されます –

素晴らしい！ありがとう@riyaz_aliそれは働いた。 – Zeeshan

あなた app.js使用で

var app = new Vue({ 
    delimiters: ['%%', '%%'], 
    el: '#app', 
    data: { 
     message: 'Hello Vue!' 
    }, 
});

、その後%%

{include file="partials/header.tpl" title="Home"} 
<body data-spy="scroll" data-target=".navbar"> 
<div class="se-pre-con"></div> 
    {include file="partials/navbar.tpl"} 
    <div class="container container-body"> 
     <div class="row"> 
      <div class="col-md-12" id="app"> 
       <h2>Test Heading</h2> 
       %% message %% 
      </div> 
     </div> 
    </div> 
{include file="partials/footer.tpl"}

出典

2017-07-01 09:19:53 Simion

PHP smartyテンプレートとVue.jsを統合するには？

答えて

関連する問題