标签:python djang ref ever 一个 image 分享图片 bubuko img
第一个vue实例:
使用VUE和jquery和js一样,都需要先导入VUE你可以去cnd上导入也可以下载到本地
<body> <div id="app"> <p>name:{{ name }}</p> <p>age:{{ age }}</p> </div> <script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.js"></script> <script> var app = new Vue({ //设置一个Vue的对象然后来进行操作 el:‘#app‘, // 对标签id为app的进行操作 data:{ name:‘老王‘, age:17 } }) </script> </body>
还可以这样写:
把你要渲染的信息进行设置为一个字典
<script>
var d = {
name:‘老赵‘,
age:18
}
var app = new Vue({
el:‘#app‘,
data:d,
})
</script>
其实vue就相当于python的django的渲染进行设置渲染
添加标签和内容:
<body> <!----> <div id="app"> <p v-html="message"></p> <!--这个是吧你的标签页渲染到这里是添加标签和内容--> <p> {{kong.split(‘‘).reverse().join(‘‘)}} <!--这个就好比你的python的字符串的 方法 先去空 然后翻转 然后再拼接--> </p> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var app = new Vue({ el:‘#app‘, data:{ message:‘<a href="https://www.baidu.com">点我</a>‘, kong:‘坚强 坚强‘ } }) </script>
对你的字体设置为翻转的 这个就好比python的字符串的操作先去空 然后 翻转然后拼接
<body> <div id="app"> <p >{{ message.split(‘‘).reverse().join(‘‘) }}</p> <!--对你的 内容进行翻转--> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var app =new Vue({ el:‘#app‘, data:{ message:‘好看不 马上我到了页面上就是翻转了‘ } }) </script>
效果显示:
结果就是翻转了
v-if 和v-show:
都是判断你的 内容是不是正确之后显示的 if是显示 show是隐藏
if的表达式当你的判断不成立就把信息给去除 而show是不正确的时候就隐藏
<body> <div id="app"> <p v-if="ok">想要</p> <!--当ok是正确的时候就显示出来--> <p v-show="ok">它想要</p> <!--当ok是正确的时候就隐藏--> </div> <!----> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var app = new Vue({ el:‘#app‘, data:{ ok:true } }) </script> </body>
效果:show是隐藏 if是去除:
标签:python djang ref ever 一个 image 分享图片 bubuko img
原文地址:https://www.cnblogs.com/zhaoyunlong/p/9361589.html