精华内容
下载资源
问答
  • 原生 js使用 getElementById 比较麻烦的地方需要为元素...这种情况使用 v-model 最方便,通过 this.inputName 即可获取对应的值。input 有默认值。即,设置了 value 属性的 Input。这种情况不能使用 v-model。否则...

    原生 js

    使用 getElementById 比较麻烦的地方

    需要为元素设置 id

    设置 id 之后,无法复用,因为一个页面中不能存在两个相同的 id

    双向绑定 v-model

    分两种情况

    input 默认为空。这种情况使用 v-model 最方便,通过 this.inputName 即可获取到对应的值。

    input 有默认值。即,设置了 value 属性的 Input。这种情况不能使用 v-model。否则 data 中的初始化值会把 value 的值覆盖掉。正确的姿势是使用 v-model, 然后通过 ajax 从后台拉取默认值,给对应的 vuejs 变量赋值。对于简单的后台渲染页面,这种方式略显复杂。

    jQuery

    不爽的地方包含了使用原生 js 的几项,同时还要额外引入 jQuery。

    ref

    在不适合使用 v-model 的时候,我更倾向于使用 ref.

    vuejs 2.0 之后,废弃了 vuejs 1.0 中的 this.$els,改用 this.$refs。即,使用 ref 属性来标识一个元素。

    这个地方抄袭 reactjs 太明显了。示例代码:

    测试

    {{ result1 }}

    测试

    {{ result2 }}

    demo.html

    Index Page

    测试

    {{ result1 }}

    测试

    {{ result2 }}

    demo.js

    new Vue({

    el: "#demo",

    data: {

    result1: null,

    result2: null,

    input2: ""

    },

    created: function() {

    // the created hook is called after the instance is created

    },

    methods: {

    test1: function () {

    this.result1 = this.$refs.input1.value + " 成功!";

    },

    test2: function () {

    this.result2 = this.input2 + " 成功!";

    }

    }

    })

    vue.min.js:6 Uncaught ReferenceError: input2 is not defined

    这是一个比较奇葩的问题,如果 v-model 的变量不在 data 中初始化,就会报这个错误。

    不知道是否是 vuejs 2.0 新引入的机制,在 1.0 中没有发现这个问题。

    展开全文
  • ele默认返回一个数组,对应id。 但是我还想拿到他们选择label 加一个ref handleChange(value) { if (value) { console.log(this.$refs.cascaderAddr.getCheckedNodes()[0].pathLabels); } }, 最后控制台...

    ele默认返回一个数组,对应其id。
    但是我还想拿到他们选择的label

    在这里插入图片描述
    加一个ref

       handleChange(value) {
          if (value) {
            console.log(this.$refs.cascaderAddr.getCheckedNodes()[0].pathLabels);
          }
        },
    

    最后控制台就可以获取了
    在这里插入图片描述

    展开全文
  • 点击h5 标签,如何才能获取当前对应的自定义属性呢? 想当然的我最开始这样写: <h5 class=left click='getDataId' data-id=item.id> [removed] methods: { getDataId() { console.log(this.data-id); } },...
  • 假设有一个标签h5, 我们给它添加了一个自定义属性,(item.id是从动态添加的)点击h5 标签,如何才能获取当前对应的自定义属性呢?想当然的我最开始这样写:代码如下:methods: {getDataId() {console.l...

    这篇文章主要为大家详细介绍了vue.js 获取当前自定义属性值,具有一定的参考价值,可以用来参考一下。

    感兴趣的小伙伴,下面一起跟随512笔记的小编两巴掌来看看吧!

    假设有一个标签h5, 我们给它添加了一个自定义属性值,(item.id是从动态添加的)

    点击h5 标签,如何才能获取当前对应的自定义属性值呢?

    想当然的我最开始这样写:

    代码如下:

    methods: {

    getDataId() {

    console.log(this.data-id);

    }

    },

    显然,这样是拿不到 data-id的值的。。。。

    应该这样做:

    代码如下:

    methods: {

    getDataId(id) {

    console.log(id);

    }

    },

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持512笔记。

    注:关于vue.js 获取当前自定义属性值的内容就先介绍到这里,更多相关文章的可以留意512笔记的其他信息。

    关键词:vue.js

    展开全文
  • 点击h5 标签,如何才能获取当前对应的自定义属性呢? 想当然的我最开始这样写: <h5 class="left t-title" @click='getDataId' :data-id="item.id"></h5> <script> methods: ...

    假设有一个标签h5, 我们给它添加了一个自定义属性值,(item.id是从动态添加的)

    点击h5 标签,如何才能获取当前对应的自定义属性值呢?

    想当然的我最开始这样写:

    <h5 class="left t-title" @click='getDataId' :data-id="item.id"></h5>
    
    <script>
        methods: {
            getDataId() {
                console.log(this.data-id);
            }
          },
        
    </script>

    显然,这样是拿不到 data-id的值的。。。。

    应该这样做:

    <h5 class="left t-title" @click='getDataId(item.id)' :data-id="item.id"></h5>
    
    <script>
        methods: {
            getDataId(id) {
                console.log(id);
            }
          },
        
    </script>

    转载于:https://www.cnblogs.com/fayin/p/6415286.html

    展开全文
  • 现在有一个问卷调查页面需求,选择了element-uiel-checkbox-group来处理多选题,在有多个多选题情况下,如何绑定v-model数据才能获取到 问题id=>对应问题下选中选项question.vue页面*{{item.title}}(多选...
  • 现在用vue编辑页面中需要使用CKEditor5富文本编辑器,...但是在控制台看代码话可以看到在对应id内是有数据了 ![图片说明](https://img-ask.csdn.net/upload/201904/08/1554719528_993591.png) 希望能有大神解答
  • 今天遇到一个问题,就是在前端想要更新数据的时候(初始数据全部信息已保存在data中),发现后台只传给该数据的ID,,想要通过ID获取对应的名称,添加到一个新的对象中。 2.问题解决方式: 通过查资料,找到 ...
  • 如何才能点击删除按钮删除对应的商品 ...商品对应的id 这种方式获取对应的id值 <template slot-scope="scope"> <el-button size="mini" type="primary" icon="el-icon-edit"></el-but...
  • 然后需要获取到列表对应的id值,直接使用 document.getElementById(it).scrollIntoView(); 具体实现: 列表:使用vue的v-for指令 ,这里的id值使用的是遍历的索引,外层是一个自定义滚动条组件。样式也是使用vue
  • 这个需求大概是这样子:我做的一个聊天Demo,在搜索框搜索用户,可以滚动到指定的用户。然后成选中状态。这是目前状态,我搜索南宫仆射 ,想要下面的...然后需要获取到列表对应的id值,直接使用 document.getElemen...
  • 有时候急着学更多新知识会把最基础的遗忘,以前使用PHP那会还知道表单序列化,最近通过form获取里面所有name属性对应的控件却把document.getElementById('表单Id').serializeArray()给遗忘了,通过遍历name属性去...
  • vue项目知识点总结

    2018-06-15 14:42:00
    一、vue如何获取select被选中的id对应的值。 1 <!-- 下拉框 --> 2 <div v-show="moreStore" class="select"> 3 <select class="choice" v-on:change="indexSelect" v-model="indexId"> ...
  • day 为 每一个刻度对应的dayjs 对象 getTimeScales(day:dayjs):dayjs[] 计算当前day可以分划多少刻度,参数为day,返回dayjs对象数组 <template v-slot:timeline="{day , getTimeScales}"> <!-- 你的时间...
  • 在写vue项目的时候,由于数据量庞大转化格式相对比较复杂,于是就直接表单获取值按String格式存入了数据库表中,但是在编辑记录的时候,又得从数据库表中按id读取,再相对应的在页面上显示; 于是:就教大家如何在...
  • 传给子组件 list.vue 所有订单数据,由子组件全部渲染出来,通过cartData变量联系,如果我在子组件中更改了购买商品的数量,也就是cartData中的值被更改了,那么,我们在父组件监听的total(所有订单总价),也会重新...
  • <p>computed 计算属性 : 依赖其它属性值,并且 computed 的值有缓存,只有它依赖的属性值发生改变,下一次获取 computed 的值时才会重新计算 computed 的值。 <p>watch 侦听器 : 更多的是「观察」的作用,无缓存性,类似...
  • 一:异步注册(主应用异步获取子应用注册表并将子应用对应的路由下发至子应用) 二:异步路由(使用应用间通信,通知子应用路由数据,子应用在内部 addRoutes 异步插入路由) 各应用间路由基础管理 公共资源...
  • 访问登录页面,但会被拦截器自动切换到“配置的第0项的登录方式对应的页面”,即账户登录方式页面,路径:/pages/ucenter/login-page/pwd-login/pwd-login。 生效策略:未列举到的或设备环境不支持的登录方式将被...
  • 其中 path.node.source.value 的值,就是我们 import from xxxx 中的地址,将地址 push 到 dependencies 中。 <pre><code>javascript  const id = ID++; const {code} = ...
  • 当用户需要访问到某个路由的时候再去加载对应的组件,那么用户没有必要在一开始的时候就将所有的路由组件下载到本地。</li><li>在多页面应用中,我们往往可以将公共模块进行抽离,比如 header, ...
  • // com 为对应的视图组件,在释放区域显示 typeList: { banner: { name: '轮播图', icon: 'el-icon-picture', com: Banner }, product: { name: '商品', icon: 'el-icon-s-goods', com: Product }, ...
  • 项目中只需要引入对应的 npm 包即可,项目不关心也无法修改组件内部的代码,只能通过组件定义的 props 控制。 区块(block):一般是一个 UI 模块,使用区块时会将区块代码拷贝...

空空如也

空空如也

1 2
收藏数 24
精华内容 9
关键字:

vue如何获取id对应的值

vue 订阅