`
arpenker
  • 浏览: 357455 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

vue学习笔记

    博客分类：
  • vue
vue 
阅读更多
前端语言。 vue.适合人员使用。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 如何用脚本控制变量并输出到界面上。</title>
<script src="https://cdn.staticfile.org/vue/2.7.0/vue.min.js"></script>
</head>
<body>
<div id="app">
  <p>{{ message }}</p>
<br/>
{{ message }}
</div>

<script>
new Vue({
  el: '#app',
  data: {
    message: 'test input this value!'
  }
})
</script>
</body>
</html>


逻辑无外乎。

引用vue.min.js,跟ext类似。
然后定位是它的强项。
用双大括号定义一个变量。{{ message }}

然后就在加载的时候，对该变量进行逻辑控制。
语法也是比较繁杂的。
new Vue({
  el: '#app',
  data: {
    message: 'test input this value!'
  }
})

非要用data的json串把它封装起来。

然后就是标准的vue启动逻辑。
new了一个vue对象并且定位到app这个目标。
然后定义了一个data的json串，并对messaage这个属性进行赋值。


流程再撸一撸。

一开始就是引入vue的标准库。然后用js启动一个vue的标准对象。

然后是定位到div ,接下来是变量进行赋值。

二次定位可以达到目标。

分享到：
| install plugin for elasticsearch
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    Vue学习笔记——【尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通-哔哩哔哩】 https://b23.tv/

    Vue学习笔记——【尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通-哔哩哔哩】 https://b23.tv/

    vue学习笔记.md

    vue学习笔记

    Vue学习笔记

    Vue的学习笔记通常会包含以下核心知识点： 1. **基础概念**：Vue的核心特性包括数据绑定、指令系统、组件化、生命周期、虚拟DOM等。数据绑定允许开发者用双大括号`{{ }}`在HTML中直接展示Vue实例中的数据。指令系统...

    vue学习笔记，B站黑马程序员的javaweb

    Vue学习笔记 Vue是一个基于JavaScript的渐进式框架，用于构建用户界面。下面是关于Vue的学习笔记。 一、Vue基本知识 在Vue中，以点vue结尾的文件称为组件文件，包含三部分：template、script、style。template是...

    VUE学习笔记

    Vue的学习笔记将涵盖其核心概念、基本用法以及实际应用。 一、Vue的核心概念 1. 双向数据绑定：Vue采用MVVM（Model-View-ViewModel）模式，通过`v-model`指令实现了视图与数据模型之间的双向绑定，使得数据变化时...

    前端Bootstrap+Es6+vue学习笔记

    前端Bootstrap+Es6+vue学习笔记 Bootstrap 框架是一种基于 HTML/CSS/JS 的开源框架，由 Twitter 公司的两名技术工程师研发。其主要特点包括： 1. 跨设备跨浏览器：Bootstrap 支持多种设备和浏览器，可以在不同的...

    JavaWeb03-Vue学习笔记

    Vue学习笔记 Vue是一个渐进式的JavaScript框架，用于构建用户界面。Vue的核心思想是将组件化的思想应用于前端开发，通过组件的方式来构建应用程序。 一、Vue简介 Vue是一个基于MVVM（Model-View-ViewModel）模式...

    Vue学习笔记（PDF、HTML版本）.zip

    这份“Vue学习笔记”涵盖了从基础到进阶的各种知识点，旨在帮助初学者快速掌握Vue的核心概念和实用技巧。 首先，Vue.js的核心特性在于其声明式的数据绑定和组件化设计。在“Vue学习笔记”中，你会了解到如何通过`v-...

    Vue学习笔记.docx

    Vue 学习笔记 Vue 是第三方开发的基于 MVVM 设计模式的渐进式的纯前端 JS 框架。MVVM 设计模式将应用程序分为三个基本组件：Model、View 和 ViewModel。Model 代表应用程序的业务逻辑，View 负责显示数据，...

    Vue学习笔记_综合案例.zip

    文件里包含综合案例代码和数据库文件、学习笔记、vuejs2中文手册，W3School全套教程。 配套博客 https://blog.csdn.net/H200102/article/details/106535213

    Vue学习笔记之分享篇.zip

    在"Vue学习笔记之分享篇.zip"这个压缩包中，我们可以期待获取到关于Vue.js的学习资料，包括文档、安装程序以及可能的代码示例。 首先，`Vue.docx`可能是作者整理的Vue学习笔记，里面可能包含了Vue的基础概念、核心...

    vue学习笔记1

    在“vue学习笔记1”中，我们主要探讨了在Vue环境中设置登录页面的过程，包括背景色设置、登录框样式、全局样式配置以及Less loader的安装和使用。 首先，Vue CLI是Vue项目的基础脚手架，它提供了一种快速初始化项目...

    最详细的Vue学习笔记

    最详细的Vue学习笔记，待续版

    HTML、CSS、JavaScript、Jquery、Node、Ajax、Vue学习笔记.zip

    本资源【HTML、CSS、JavaScript、Jquery、Node、Ajax、Vue学习笔记.zip】旨在为前端开发者提供全面的学习资料，涵盖从基础到进阶的各类知识点。包括HTML的基本结构和常用标签、CSS的样式设置与布局技巧、JavaScript...

    Vue学习笔记（狂神）.md

    Vue学习笔记（狂神）.md

    1_Vue学习笔记.pdf

    根据提供的文件内容，以下是关于Vue学习笔记的知识点总结： 一、Vue基础部分 1. el和data的两种写法 在Vue.js中，创建Vue实例时，可以通过两种方式指定el和data属性： - 对象式：直接在Vue实例化时，将el和data...

    Vue学习笔记初中级别保姆级

    Vue学习笔记保姆级别

Magicbox
Global site tag (gtag.js) - Google Analytics