亮点:直接在界面里呼叫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-mapvgl是一个基于Vue开发的百度地图mapvgl组件项目,包含137个文件,其中包括47个Markdown文件、29个JavaScript文件、29个Vue文件、7个PNG图片文件、6个HDR图片文件、3个JSON文件、3个GLTF文件、2个ICO图标文件...
【Vue.js概述】 Vue.js,简称Vue,是一个用于构建用户界面的渐进式框架,它在JavaScript社区中广受欢迎,因为它既易于上手,又能处理复杂的前端应用。Vue的核心库专注于视图层,易于与其他库或已有的项目集成。它的...
Vue.js 是一款流行的前端JavaScript框架,它简化了Web应用程序的开发流程。Vue Devtools 是一个强大的开发者工具,专为Vue应用程序而设计,可帮助开发者深入理解应用的状态和生命周期。它是作为一个谷歌浏览器的扩展...
vue脚手架 vue项目包包含vue2,vue3 所包含的环境:Router路由 Vuex CSS Pre-processors CSS预处理程序(sass)vue脚手架 vue项目包包含vue2,vue3 所包含的环境:Router路由 Vuex CSS Pre-processors CSS预处理程序...
Vue3.0是Vue.js框架的重大更新,带来了许多性能优化和功能增强,旨在提供更高效、更灵活的开发体验。这次升级引入了Composition API,它允许开发者以更模块化的方式组织组件逻辑,使得代码更易于理解和维护。Vue3.0...
Vue.js和Vue.min.js是两种版本的同一款前端JavaScript框架——Vue.js的实现。Vue.js由尤雨溪(Evan You)开发,旨在为构建用户界面提供简洁、易用且可扩展的工具。这两个文件在功能上是相同的,但它们在实际应用中...
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是Vue.js框架的最新版本,它引入了许多性能优化和开发体验改进,包括Composition API、...
`vue.global.js` 文件是 Vue.js 框架的核心文件之一。它包含了 Vue.js 全局对象的定义和一些全局方法和属性的实现。 该文件对整个 Vue.js 应用的运行起着重要的作用,它提供了全局范围的 Vue 构造函数和一些全局...
谷歌浏览器 chrome vue 调试插件 vue-devtools chrome(谷歌浏览器)vue代码调试插件, 已打包。解压后,通过chrome扩展程序加载即可使用。 使用方法: 1、chrome浏览器输入地址“chrome://extensions/”进入扩展...
Vue.js 是一款轻量级、高性能的前端框架,它的组件化思想使得构建复杂Web应用变得更加简单。在Vue.js生态中,有许多优秀的插件用于增强应用的功能,其中之一就是"vueemoji",这是一款专为Vue.js设计的高效且易用的...
vue思维导图,主要涉及1、MVVM思想 2、vue常见指令 3、Vue生命周期的介绍 4、组件间通信 5、路由的使用 vue-router 6、vue发送 ajax请求 7、计算属性,方法与侦听器 8、组件间绑定原生事件 9、vue常见插件 ...
Vue.js devtools是针对Vue3开发的浏览器扩展插件,它是前端开发者不可或缺的工具,尤其对于Vue项目的调试和性能优化至关重要。Vue3开发者工具提供了一种直观的方式,让我们可以直接在浏览器环境中查看和操作Vue应用...
npm install vue-class-component vue-property-decorator --save-dev 一梭子直接干; 其次,咱来说说它们的区别与联系: vue-property-decorator社区出品;vue-class-component官方出品 vue-class-component提供了...
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+...
基于vue3的春节烟花许愿代码.zip基于vue3的春节烟花许愿代码.zip 基于vue3的春节烟花许愿代码.zip基于vue3的春节烟花许愿代码.zip 基于vue3的春节烟花许愿代码.zip基于vue3的春节烟花许愿代码.zip 基于vue3的春节...
Vue.js 是一个流行的前端JavaScript框架,用于构建用户界面。Vue DevTools 是一款强大的浏览器扩展,专为Vue.js应用提供实时调试工具。它允许开发者在浏览器的开发者工具中查看和操作应用的状态,包括组件树、属性、...
【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 实战课程,...