1.创建工作区

2.点击添加文件

3.新建一个html文件,并输入!+tab  自动生成html结构

4.输入div#app,生成头部

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <title>VUE体验</title>
</head>
<body>
    <div id="app">
        <p>{{username}}</p>
        <p>{{greet()}}</p>
        <button @click="username='你也好'">更改按钮</button>
    </div>
    <script>
    new Vue({
        el: "#app",
        data:{
            username : "你好"
        },
        methods:{
            greet(){
                return "我是函数"
            }
        }
    }
    )
       
    </script>
</body>
</html>

需要下载这个插件open in browser

vue体验的更多相关文章

  1. Vue基本入门

    介绍 1.Vue.js是什么? Vue.js(读音:/vju:/,类似于view)是一套构建用户界面的渐进式框架,与其他重量级框架不同的是,Vue采用的是自底向上增量开发的设计. Vue的核心库只关注 ...

  2. 【腾讯Bugly干货分享】基于 Webpack & Vue & Vue-Router 的 SPA 初体验

    本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/57d13a57132ff21c38110186 导语 最近这几年的前端圈子,由于 ...

  3. vue初体验:实现一个增删查改成绩单

    前端变化层出不穷,去年NG火一片,今年react,vue火一片,ng硬着头皮看了几套教程,总被其中的概念绕晕,react是faceback出品,正在不断学习中,同时抽时间了解了vue,查看了vue官方 ...

  4. 基于 Webpack & Vue & Vue-Router 的 SPA 初体验

    基于 Webpack & Vue & Vue-Router 的 SPA 初体验 本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com ...

  5. vue开发体验

    *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...

  6. vue.js2.0 自定义组件初体验

    理解 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能.在有些情况 ...

  7. vue.js 初体验— Chrome 插件开发实录

    欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者:陈纬杰 背景 对于经常和动画开发打交道的开发者对于Animate.css这个动画库不会陌生,它把一些常见 ...

  8. 一次基于Vue.Js用户体验的优化

    .mytitle { background: #2B6695; color: white; font-family: "微软雅黑", "宋体", "黑 ...

  9. 原创《如何用vue来轻松的驾驭 html5 webapp的页面体验》

    由于最近开始要做mobile的webapp 项目,所以利用周末的时间思考了下页面的体验问题,我主要参考了"微信"的页面体验,总结主要有2个页面切换效果(点击进入页面效果 和 返回上 ...

随机推荐

  1. 7.2 Tornado异步

    7.2 Tornado异步 因为epoll主要是用来解决网络IO的并发问题,所以Tornado的异步编程也主要体现在网络IO的异步上,即异步Web请求. 1. tornado.httpclient.A ...

  2. label标签利用jquery获取值得方式为$("#message").html()

    label标签利用jquery获取值的方式为$("#message").text(), 赋值的方式为:$("message").html("北京欢迎你 ...

  3. STL源码剖析-智能指针shared_ptr源码

    目录一. 引言二. 代码实现 2.1 模拟实现shared_ptr2.2 测试用例三. 潜在问题分析 你可能还需要了解模拟实现C++标准库中的auto_ptr一. 引言与auto_ptr大同小异,sh ...

  4. List集合取其中指定几条数据

    newList= oldList.subList(start, end); start,end分别是第几个到第几个,截取的内容包含前不包含结尾,用下标索引 此方法会改变原始list列表,返回的这个子列 ...

  5. nanogui之更新子模块glfw3.3.2踩坑总结

    nanogui源码下载: A . https://github.com/wjakob/nanogui B . https://github.com/dalerank/nanogui B是fork的A, ...

  6. leetcode5225最大相等频率

    题目 正整数数组nums,找到满足条件的最长前缀,返回其长度.该前缀满足:删除一个元素后,剩下的每个数字出现的次数相同. ps:如果删除后没有元素存在,也可以认为每个数字有相同的次数. 数组长度:[2 ...

  7. 分布式系统(二)——GFS

    分布式存储系统的难点 在存储系统中,为了获得巨大的性能加成,一个很自然的想法就是采用分片(sharding),将数据分割存储到多台服务器上,这样获得了更大的存储容量,而且可以并行地从多台服务器读取数据 ...

  8. 【服务器】【环境搭建】WordPress建立数据库连接时出错---问题---解决

    这意味着您在wp-config.php文件中指定的用户名和密码信息不正确,或我们未能在localhost联系到数据库服务器.这可能意味着您主机的数据库服务器未在运行. 您确定用户名和密码正确吗? 您确 ...

  9. Python基础入门(9)- Python文件操作

    1.文件的读写 1.1.文件的创建与写入 利用内置函数open获取文件对象 文件操作的模式之写入 文件对象的操作方法之写入保存 1 # coding:utf-8 2 3 import os 4 5 c ...

  10. [Guide]Google Python Style Guide

    扉页 项目主页 Google Style Guide Google 开源项目风格指南 - 中文版 背景 Python 是Google主要的脚本语言.这本风格指南主要包含的是针对python的编程准则. ...