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

vue

    博客分类：
  • vue
vue 
阅读更多
亮点：直接在界面里呼叫vue的自定义方法。
调用 时跟js的语法是一样的。
也是直接用details(),就可以搞定了。

但是自定义跟js还是有一点小区别。
在vue对象里自定义一个方法供调用 。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue  </title>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
</head>
<body>
<div id="vue_det">
<h1>site : {{site}}</h1>
<h1>url : {{url}}</h1>
<h1>{{details()}}</h1>
</div>
<script type="text/javascript">
var vm = new Vue({
el: '#vue_det',
data: {
site: "菜鸟教程",
url: "www.runoob.com",
alexa: "10000"
},
methods: {
details: function() {
return  this.site + " -风雨前行。";
}
}
})
</script>
</body>
</html>



撸一撸逻辑。
1.引用vue的标准库js.
2.在界面上定义需要使用的变量和界面上需要调用方法的地方。

3.自定方法。
在vue的对象里先定位到目标div层。然后对变量进行赋值。是使用data的json串的形式。
方法是methods中定义一个details的方法
以函数返回的形式，把值返回到界面上。
分享到：
| vue学习笔记
评论
发表评论

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

相关推荐

    基于Vue的百度地图mapvgl组件vue2和vue3设计源码

    vue-mapvgl是一个基于Vue开发的百度地图mapvgl组件项目，包含137个文件，其中包括47个Markdown文件、29个JavaScript文件、29个Vue文件、7个PNG图片文件、6个HDR图片文件、3个JSON文件、3个GLTF文件、2个ICO图标文件...

    尚硅谷_Vue全家桶_基于VUE_vue；尚硅谷_vue_

    【Vue.js概述】 Vue.js，简称Vue，是一个用于构建用户界面的渐进式框架，它在JavaScript社区中广受欢迎，因为它既易于上手，又能处理复杂的前端应用。Vue的核心库专注于视图层，易于与其他库或已有的项目集成。它的...

    vue 开发者工具devtools(谷歌浏览器插件)，包括vue2和vue3

    Vue.js 是一款流行的前端JavaScript框架，它简化了Web应用程序的开发流程。Vue Devtools 是一个强大的开发者工具，专为Vue应用程序而设计，可帮助开发者深入理解应用的状态和生命周期。它是作为一个谷歌浏览器的扩展...

    vue2，vue3已经生成好的脚手架（空项目包）

    vue脚手架 vue项目包包含vue2，vue3 所包含的环境：Router路由 Vuex CSS Pre-processors CSS预处理程序（sass）vue脚手架 vue项目包包含vue2，vue3 所包含的环境：Router路由 Vuex CSS Pre-processors CSS预处理程序...

    vue3.0 vue-quill-editor.rar

    Vue3.0是Vue.js框架的重大更新，带来了许多性能优化和功能增强，旨在提供更高效、更灵活的开发体验。这次升级引入了Composition API，它允许开发者以更模块化的方式组织组件逻辑，使得代码更易于理解和维护。Vue3.0...

    vue.js和vue.min.js

    Vue.js和Vue.min.js是两种版本的同一款前端JavaScript框架——Vue.js的实现。Vue.js由尤雨溪（Evan You）开发，旨在为构建用户界面提供简洁、易用且可扩展的工具。这两个文件在功能上是相同的，但它们在实际应用中...

    vue@3.4.15 本地离线资源

    vue@3.4.15 本地资源 All files（包含资源） /npm/vue@3.4.15/dist /npm/vue@3.4.15/compiler-sfc /npm/vue@3.4.15/jsx-runtime /npm/vue@3.4.15/server-renderer /npm/vue@3.4.15/index.js /npm/vue@3.4.15/...

    vue3-captcha（vue3行为验证码）

    Vue3-Captcha是一款专为Vue3框架设计的行为验证码插件，旨在提高网站的安全性，防止自动化脚本或机器人进行恶意操作。Vue3是Vue.js框架的最新版本，它引入了许多性能优化和开发体验改进，包括Composition API、...

    vue.global.js，Vue.js 框架的核心文件之一

    `vue.global.js` 文件是 Vue.js 框架的核心文件之一。它包含了 Vue.js 全局对象的定义和一些全局方法和属性的实现。 该文件对整个 Vue.js 应用的运行起着重要的作用，它提供了全局范围的 Vue 构造函数和一些全局...

    谷歌浏览器 chrome vue 调试插件 vue-devtools 及源码

    谷歌浏览器 chrome vue 调试插件 vue-devtools chrome（谷歌浏览器）vue代码调试插件， 已打包。解压后，通过chrome扩展程序加载即可使用。 使用方法： 1、chrome浏览器输入地址“chrome://extensions/”进入扩展...

    vueemoji基于Vue好用的emoji插件

    Vue.js 是一款轻量级、高性能的前端框架，它的组件化思想使得构建复杂Web应用变得更加简单。在Vue.js生态中，有许多优秀的插件用于增强应用的功能，其中之一就是"vueemoji"，这是一款专为Vue.js设计的高效且易用的...

    vue总结.xmind

    vue思维导图，主要涉及1、MVVM思想 2、vue常见指令 3、Vue生命周期的介绍 4、组件间通信 5、路由的使用 vue-router 6、vue发送 ajax请求 7、计算属性,方法与侦听器 8、组件间绑定原生事件 9、vue常见插件 ...

    Vue.js devtools(Vue3开发者工具插件)

    Vue.js devtools是针对Vue3开发的浏览器扩展插件，它是前端开发者不可或缺的工具，尤其对于Vue项目的调试和性能优化至关重要。Vue3开发者工具提供了一种直观的方式，让我们可以直接在浏览器环境中查看和操作Vue应用...

    详解TypeScript+Vue 插件 vue-class-component的使用总结

    npm install vue-class-component vue-property-decorator --save-dev 一梭子直接干； 其次，咱来说说它们的区别与联系： vue-property-decorator社区出品；vue-class-component官方出品 vue-class-component提供了...

    Vue学习.pdf（Vue学习个人笔记资料-菜鸟入门）

    Vue.js 是一款轻量级的前端JavaScript框架，由尤雨溪开发，于2014年发布。它以简单易学和高效为核心，适用于构建复杂且响应式的用户界面。Vue的特点在于其渐进式架构，允许开发者逐步将Vue融入现有的项目中，而不必...

    vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化

    vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化vue3+ts+...

    基于vue3的春节烟花许愿代码.zip

    基于vue3的春节烟花许愿代码.zip基于vue3的春节烟花许愿代码.zip 基于vue3的春节烟花许愿代码.zip基于vue3的春节烟花许愿代码.zip 基于vue3的春节烟花许愿代码.zip基于vue3的春节烟花许愿代码.zip 基于vue3的春节...

    vue-devtools安装包

    Vue.js 是一个流行的前端JavaScript框架，用于构建用户界面。Vue DevTools 是一款强大的浏览器扩展，专为Vue.js应用提供实时调试工具。它允许开发者在浏览器的开发者工具中查看和操作应用的状态，包括组件树、属性、...

    Vue3pdf中文文档

    【Vue3pdf中文文档】和【Vue3pdf中文教程】主要涵盖了Vue3框架的基本概念、安装方式、核心特性以及如何在项目中应用Vue3。Vue3是Vue.js框架的最新版本，它在Vue2的基础上进行了许多优化和改进，旨在提供更高效、更...

    Vue3集成ThreeJS实现3D效果，threejs+Vite+Vue3+TypeScript 实战课程

    Vue3集成ThreeJS实现3D效果，threejs+Vite+Vue3+TypeScript 实战课程，Vue3集成ThreeJS实现3D效果，threejs+Vite+Vue3+TypeScript 实战课程，Vue3集成ThreeJS实现3D效果，threejs+Vite+Vue3+TypeScript 实战课程，...

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