后台渲染模板如swig，也使用“{{ }}“作为渲染，与前端vue的产生冲突，此时只要在新建Vue对象时，添加delimiters: ['${', '}'],就搞定了，代码如下

<!DOCTYPE html>

<html lang="zh-CN">

  <head>

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->

    <title>Blog Template for Bootstrap</title>

  </head>

  <body>

   <div id="app">

   555

  ${message }

</div>

    <!-- Bootstrap core JavaScript

    ================================================== -->

    <!-- Placed at the end of the document so the pages load faster -->

    <script src="/public/js/vue.js"></script>

    <script>

    //Vue.config.delimiters = ['${', '}$'];

        var app= new Vue({

         delimiters: ['${', '}'],

    el:'#app',

    data:{

        regDom: 1

        ,loginDom: 0

        ,message: 'Hello Vue!'

    }

});

    </script>

  </body>

</html>

官方参考地址：http://vuejs.org/api/#delimiters

vue.js与后台模板引擎“双花括号”冲突时的解决办法的更多相关文章

  1. 后台模板引擎ejs与前台模板引擎artTemplate的简单介绍

    动态网页是指前端页面当中的数据内容来源于后台数据库,前端的html代码会随着后台数据的变化而变化,是动态生成的.制作动态网页有两种方式,一种方式是在后台拿到前端的html模板,利用后台模板引擎(如ej ...

  2. Jade —— 源于 Node.js 的 HTML 模板引擎

    2013-12-11 发布 Jade —— 源于 Node.js 的 HTML 模板引擎 开源项目介绍 web 模板引擎 node.js jade 207.8k 次阅读  ·  读完需要 69 分钟 ...

  3. ORA-00907: 缺失右括号，原因及解决办法整理

    ORA-00907: 缺失右括号,原因及解决办法整理 1 union all中order by 导致缺失右括号 在有union all的子查询中使用了order by,会导致缺失右括号的错误,事实上在 ...

  4. 当Vue可视化工具创建不了项目时的解决办法！

    当Vue可视化工具创建不了项目时的解决办法! 当你尝试用可视化工具创建一个Vue的项目的时候,报错, 出现什么indexOf什么什么的错误! 我的解决办法是把可视化工具删除掉,重新下载! 如果你是 n ...

  5. 说说如何用js实现一个模板引擎

    本文同步更新在: https://github.com/whxaxes/blog/issues/4 ,在 github 看文章显示效果会更好一些. 前言 不知不觉就很长时间没造过什么轮子了,以前一直想 ...

  6. Vue.js系列之三模板语法

    Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据.所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解 ...

  7. JavaScript模板引擎artTemplate.js——如何引入模板引擎？

    artTeamplate.js在github上的地址:artTemplate性能卓越的js模板引擎 引入模板引擎,就是引入外部javascript啦,并且artTemplate.js不依赖其他第三方库 ...

  8. JavaScript模板引擎artTemplate.js——为什么使用模板引擎？

    作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...

  9. Vue.js连接后台数据jsp页面 ￣▽￣

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

随机推荐

  1. 6 Wcf使用Stream传输

    1.创建service和client项目 service项目新建wcf服务文件 MediaService 和 IMediaService IMediaService 代码为 using System. ...

  2. Android 事件分发机制具体解释

    很多其它内容请參照我的个人网站: http://stackvoid.com/ 网上非常多关于Android事件分发机制的解释,大多数描写叙述的都不够清晰,没有吧来龙去脉搞清晰,本文将带你从Touch事 ...

  3. REST = HTTP动词（GET POST PUT DELETE）操作 + 服务器暴露资源URI，最后返回状态码（充分利用HTTP自身的特征，而不仅仅是把HTTP当作传输协议。Rest协议是面向资源的，SOAP是面向服务的），表现形式可以是JSON XML BIN，举例很清楚

    好处是,操作系统或者浏览器,可以重复利用它们内置的缓存机制等等. 增删改查都是一个地址,具体靠http头部信息判断. 利用HTTP协议语义构建的语义化.可缓存的接口. URL定位资源,用HTTP动词( ...

  4. [LeetCode] Subsets [31]

    题目 Given a set of distinct integers, S, return all possible subsets. Note: Elements in a subset must ...

  5. RTB业务知识2-Open-RTB全景

    一个.前言 openrtb这是一套开源的竞价广告系统,来自IAB贡献,井. 有许多值太借鉴,提供sdk api接口文档介绍,整理了相关的资料.主要包含其生态图体系.业务流程和基本的对象模型和数据模型. ...

  6. 最新用WPF为触摸屏写了一个手写程序，双格输入的

    原文:最新用WPF为触摸屏写了一个手写程序,双格输入的 双格输入可以提高手写速度,当前字写完以后可以自动识别提交,写下一个字.这样比单格手写速度提高一倍.特别适合触摸屏程序使用 界面如下: 程序如下: ...

  7. Oracle 已有则更新，没有则插入

    使用merge merge into 表名 t1 using (select '数据数据' 字段1,'数据数据' 字段2 from dual) t2 on (t1.字段1 = t2.字段1) when ...

  8. WPF Button控件模板

     <Window x:Class="ControlTemplateDemo.MainWindow"        xmlns="http://schemas.m ...

  9. 芯片超Intel，盈利比肩Apple，三星成科技界"全民公敌"

    原标题:芯片超英特尔,盈利比肩苹果:三星现在是科技界“全民公敌”了   当人们津津乐道于三星的手机业务或者是电视业务时,它已静悄悄的拿下了芯片行业的第一,并且凭借着在芯片上的巨大获利让它的老对手们眼红 ...

  10. WPF中ItemsControl应用虚拟化时找到子元素的方法

    原文:WPF中ItemsControl应用虚拟化时找到子元素的方法  wpf的虚拟化技术会使UI的控件只初始化看的到的子元素, 而不是所有子元素都被初始化,这样会提高UI性能. 但是我们经常会遇到一个 ...