<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
</head> <body>
//1.绑定dom内容
<a>{{name}}</a>
  //2.绑定dom标签属性
  <a :href="location">百度</a>
  //绑定函数
<button @click="add">添加</button> <script>
new Vue({

      data(){
                return {
name:'tom',
age:18,
            location:'www.baidu.com'
}
}
      , methods:{ add(){ 
            alert("添加数据");
         }
            }
    });

</script>

</body>

</html>

4.0 vue绑定dom属性和函数的方法的更多相关文章

  1. Swift类与结构、存储属性、计算属性、函数与方法、附属脚本等

    写了12个Person来复习,不过完成同样的代码需要敲键盘的次数相比OC确实少了很多,这很多应该归功于Swift中不写分号,以及少了OC中的中括号. 一.类与结构体 两者在Swift中差不了多少了 类 ...

  2. Vue.js 计算属性(computed)

    Vue.js 计算属性(computed) 如果在模板中使用一些复杂的表达式,会让模板显得过于繁重,且后期难以维护.对此,vue.js 提供了计算属性(computed),你可以把这些复杂的表达式写到 ...

  3. vue 绑定属性 绑定Class 绑定style

    <template> <div id="app"> <h2>{{msg}}</h2> <br> <div v-bi ...

  4. Vue绑定属性 绑定Class 绑定style

    <template> <div id="app"> <h2>{{msg}}</h2> <br> <div v-bi ...

  5. 黑马vue---17、vue中通过属性绑定绑定style行内样式

    黑马vue---17.vue中通过属性绑定绑定style行内样式 一.总结 一句话总结: 如果属性名中带有短线必须加引号,比如: h1StyleObj: { color: 'red', 'font-s ...

  6. 黑马vue---16、vue中通过属性绑定为元素设置class类样式

    黑马vue---16.vue中通过属性绑定为元素设置class类样式 一.总结 一句话总结: 这里就是为元素绑定class样式,和后面的style样式区别一下 vue中class样式绑定方式的相对于原 ...

  7. 怎样在 Vue 里面绑定样式属性 ?

    在 Vue 里绑定样式属性可以使用 v-bind:class="" 和 v-bind:style="" , 二者都可以接受 变量 / 数组 / 对象. 不同点是 ...

  8. Vue.js04:vue样式-通过属性绑定方式为元素设置class类样式

    <!-- 传统写法 --> <h1 class="red thin">这是一个h1标签</h1> <!-- 第一种使用方式,直接传递一个数 ...

  9. Vue学习之路8-v-on指令学习简单事件绑定之属性

    前言 上一篇文章以v-on指令绑定click事件为例介绍了v-on指令的使用方法,本文介绍一下v-on绑定事件的一些属性的使用方法. v-on绑定指令属性 .stop属性 阻止单击事件继续向上传播(简 ...

随机推荐

  1. zx-editor 移动端(HTML5)富文本编辑器,可与原生App混合(hybrid)开发

    ZxEditor 移动端HTML文档(富文本)编辑器,支持图文混排.引用.大标题.无序列表,字体颜色.加粗.斜体. 可用于独立web项目开发,也可以用于与原生App混合(hybrid)开发. 源码地址 ...

  2. Codepen 每日精选(2018-3-31)

    按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以打开原始页面. 制作像素画的画板https://codepen.io/abeatrize/... 纯 css 画的晚上的风 ...

  3. idea 创建maven web项目部署在 tomcat maven plugin中

    前提:1.安装jdk,多数系统使用jdk1.8.xxx,因此选择下载此版本的居多 2.安装Maven 3.部署到tomcat我们可以有两种方式,一种是利用tomcat插件来进行部署,另一种是下载tom ...

  4. Linux环境下Eclipse中快捷键不起作用

    在window->Preferences->general->keys中, 找到 content asist 修改下边值 Binding 改成 Alt+/ When 改为 Editi ...

  5. 使用babel编译器将es6代码转为es5的方法

    1.首先需要安装工具 babel-cli =========  npm i babel-cli -g   install 可以使用i 代替 2.安装插件   npm i --save-dev babe ...

  6. OpenHarmony 3.1 Beta 版本关键特性解析——ArkUI canvas组件

    (以下内容来自开发者分享,不代表 OpenHarmony 项目群工作委员会观点) 江英杰 华为技术有限公司 canvas 是 ArkUI 开发框架里的画布组件,常用于自定义绘制图形.因为其轻量.灵活. ...

  7. Java实现平滑加权轮询算法--降权和提权

    上一篇讲了普通轮询.加权轮询的两种实现方式,重点讲了平滑加权轮询算法,并在文末留下了悬念:节点出现分配失败时降低有效权重值:成功时提高有效权重值(但不能大于weight值). 本文在平滑加权轮询算法的 ...

  8. 史上最全log4j2远程命令执行漏洞汇总报告

    已投稿信安之路公众号,文章链接

  9. 1903021116—吉琛—Java第三周作业—eclipse创建Java程序

    项目 内容 课程班级博客链接 19级信计班 这个作业要求链接 eclipse如何创建java程序 java语言基础(上) 我的课程学习目标 1. 学习博客园更多使用技巧 2. 通过作业实践熟练与熟悉掌 ...

  10. 2021.11.09 P3435 [POI2006]OKR-Periods of Words(KMP)

    2021.11.09 P3435 [POI2006]OKR-Periods of Words(KMP) https://www.luogu.com.cn/problem/P3435 题意: 对于一个仅 ...