使用VUE在Django中打印“Hello World”
来源:互联网 发布:python count函数 编辑:程序博客网 时间:2024/05/22 14:20
django模板与vue.js的变量都是使用“{{”和“}}”包裹起来的,在渲染django模板时会先替代掉所有的“{{”和“}}”及被包裹在其中的内容,使得vue.js没有使用”{{“、”}}”来绑定变量。
处理方法:
方法1:修改vue.js的默认的绑定符号
Vue.config.delimiters = ["[[", "]]"];
执行这个之后,你就可以使用“[[”、“]]”来绑定变量的数据了
方法2:使用模板的标签来输出“{{”、“ }}”
django模板的templatetag 可以渲染模板时输出模板标签,标签参数及输出如下:
我们可以在模板中用
{% templatetag openvariable %} {% templatetag closevariable %}
来替代”{{“、”}}”
方法3:禁用django模板渲染
django标签 verbatim可以使包裹其中的代码不进行渲染保持原样输出
{% verbatim %} {{ vue }}{% endverbatim %}
我们可以在需要用于vue.js的地方使用{% verbatim %} {% endverbatim %}包裹。
例如:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="/static/js/vue.js"></script></head><body> <div id="app"> {% verbatim %} <p>{{ message }}</p> {% endverbatim %} </div> <script> var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) </script></body></html>
通过浏览器访问看到打印“Hello Vue!”
参考文章:
https://adiyatmubarak.wordpress.com/2016/01/23/change-vue-js-default-template-tags/
https://docs.djangoproject.com/es/1.10/ref/templates/builtins/#templatetag
阅读全文
4 0
- 使用VUE在Django中打印“Hello World”
- 使用C++打印hello world
- 不使用main方法入口,在控制台打印“hello world”
- Vue基本使用一-hello world
- 在Linux下打印出Hello World!
- 不使用main方法打印Hello World
- vue-hello-world
- 在 Python中使用 cout << 'Hello,world!' << endl
- 在VS2005中使用MessageBox("Hello,World!")出错
- 在Node.js中使用RabbitMQ系列一 Hello world
- Django Hello World app
- django输出 hello world
- Django Hello World
- Django-hello world
- Django开发 hello world
- Django Hello World
- Django的Hello World
- django版hello world
- IntelliJ IDEA快捷键总结
- javascript代码的小小重构
- Android
- windows需要关闭的大量读写硬盘的服务
- crond与crontab
- 使用VUE在Django中打印“Hello World”
- 纯虚函数访问权限
- JS简易日历
- 算法作业_27(2017.6.8第十六周)
- 地图投影系列浅析(三)_ 地图投影
- MATLAB初探
- MapReduce google经典文章
- CSDN日报20170608 ——《从高考到程序员》
- 特征点匹配——ORB算法介绍