Vue01

最新推荐文章于 2024-06-02 17:09:24 发布

V__

最新推荐文章于 2024-06-02 17:09:24 发布

阅读量111

点赞数

分类专栏：笔记

本文链接：https://blog.csdn.net/qq_44888661/article/details/105696346

版权

笔记专栏收录该内容

15 篇文章 0 订阅

订阅专栏

<script>
    let vue = new Vue({
        el: '#app',
        data: {
            mag:'helloVue',
            msg:'HelloVue'
        },
        methods: {
            stop:function () {
            }
        }
    });
</script>

v-cloak: 在style中设置为none，在用户访问网速很慢时，可以看不到花括号。
v-text和｛｛｝｝:都可以把变量渲染到页面中，前者是在容器标签内使用v-text=‘’msg‘’ ，标签内的值会被替换掉，后者可以直接在两个花括号前或者后加入其他文字
v-html:会解析html标签
v-blind:简写成: ，在标签属性前加这个，表示这个属性的值是一个变量，会在vue对象去找这个变量对应的值
v-on:简写成@ ，会在事件前加入这个属性，属性值对应vue里面的函数名

箭头函数 : 使函数两边的this作用对象不改变。
定时器:setInterval()
字符串分割:substring(从这里开始，从这里结束) 左闭又开

1、$("#form").serialize() 将表单值序列化为字符串，如 username=admin&password=123

2、$("#form").serializeObject() 将表单序列化为一个json对象，如 {username：admin，password：123}

3、$("#form").serializeArray() 将表单序列化为一个数组，如 [ {username：admin，password：123}, {username：admin，password：123} ]

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>01</title>
    <script src="./lib/vue.js"></script>
</head>
<body>
<div id="app">
    <h3 v-text="msg">HelloWorld</h3>
    <p>HelloWorld{{mag}}hello</p>
    <hr>
    <p v-html="h"></p>
    <p v-text="h"></p>
<!--    v-bind也可以简写为:-->
    <button v-bind:title="title" v-on:click="run">浪起来</button>
    <button :title="title" @click="stop">停止</button>
    <h3 v-text="msg">HelloWorld</h3>
</div>
<script>
    let vue = new Vue({
        el: '#app',
        data: {
            mag:'helloVue',
            msg:'HelloVue',
            h:'<h1>这是一个html标签</h1>',
            title:'这是一个自定义的按钮',
            interval:null
        },
        methods: {
            stop:function () {
                console.log("123")
                clearInterval(this.interval);
                this.interval = null;
            },
            run(){
                if (this.interval != null) return;
                this.interval = setInterval( () => {
                    let star = this.msg.substring(0,1);
                    let end = this.msg.substring(1);
                    this.msg = end + star;
                },400);

            }
        }
    });
</script>
</body>
</html>

V__

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue01

var vue = new Vue(el: #app，data:｛msg:我｝methods: ｛｝)v-cloak: 在style中设置为none，在用户访问网速很慢时，可以看不到花括号。v-text和｛｛｝｝:都可以把变量渲染到页面中，前者是在容器标签内使用v-text=‘’msg‘’ ，标签内的值会被替换掉，后者可以直接在两个花括号前或者后加入其他文字v-html:会解析ht...
复制链接

扫一扫