VUE常用指令及方法

1.有时候我们需要的是点击按钮跳出弹窗,选择判断后进行跳转,我们常用.$router.push 跳转 传参:
<button @click = "func()">跳转</button>

//js
<script>
    export default{
        methods:{
            func (){
                this.$router.push({name: '/order/page1',params:{ id:'1'}});
            }
        }
    }
</script>
2..Query(页面传递参数,获取参数)

页面通过path和query传递参数,

this.$router.push({path:'/perfectInfo',query:{mobile:'15011361103',uid:'asdasdsa'}});

在目标页面通过this.$route.query获取参数:


this.$route.query.mobile

2.

原生 js

使用 getElementById 比较麻烦的地方

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

双向绑定 v-model

分两种情况

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

3.vue访问其他页面的时候(例如百度),正确格式

window.location.href = 'http://www.baidu.com';

切忌:不要忘记添加http!!!

猜你喜欢

转载自blog.csdn.net/ld395353765/article/details/82596090