用Vue制作的简易计算器

最新推荐文章于 2024-04-09 10:43:49 发布

CodingIsNotEasy

最新推荐文章于 2024-04-09 10:43:49 发布

阅读量670

点赞数

分类专栏：我的Vue旅程

本文链接：https://blog.youkuaiyun.com/CodingIsNotEasy/article/details/102941997

版权

本文介绍如何使用Vue.js框架开发一个简单的计算器应用，涵盖了组件化、响应式数据绑定、事件处理等核心概念。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<html>
<body>
<div id="demo">
    <h2>简单加减乘除计算器</h2>
    <p>请输入第一个数：<input type="text" v-model="firNum"></p>
    <p>请输入第二个数：<input type="text" v-model="secNum"></p>
    <p>
        <button @click="plus">+</button>
        <button @click="dec">-</button>
        <button @click="multiple">x</button>
        <button @click="devise">/</button>
    </p>
    <p>计算结果：<span v-text="result"></span></p>
</div>
<script>
    var v = new Vue({
        el:"#demo",
        data:{
            firNum:"",
            secNum:"",
            result:""
        },
        methods:{
            plus:function () {
              // this.result

最低0.47元/天解锁文章