Hbuilder-添加删除

柔情只为你懂 2022-09-13 15:28 212阅读 0赞

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5bCP5bGB5a2p5aSn5biFLeadqOWwkeW5sw_size_20_color_FFFFFF_t_70_g_se_x_16][]

<template>
        <view>
            <view class="uni-padding-wrap uni-common-mt">
                <view class="text-box" scroll-y="true">
                    <text>{
       {text}}</text>
                </view>
                <view class="uni-btn-v">
                    <button type="primary" :disabled="!canAdd" @click="add">add line</button>
                    <button type="warn" :disabled="!canRemove" @click="remove">remove line</button>
                </view>
            </view>
        </view>
    </template>
    
    <script>
    	 export default {
    	     data() {
    	         return {
    	             texts: [
    	                 'HBuilder，500万开发者选择的IDE',
    	                 'MUI，轻巧、漂亮的前端开源框架',
    	                 'wap2app，M站快速转换原生体验的App',
    	                 '5+Runtime，为HTML5插上原生的翅膀',
    	                 'HBuilderX，轻巧、极速，极客编辑器',
    	                 'uni-app，终极跨平台方案',
    	                 'HBuilder，500万开发者选择的IDE',
    	                 'MUI，轻巧、漂亮的前端开源框架',
    	                 'wap2app，M站快速转换原生体验的App',
    	                 '5+Runtime，为HTML5插上原生的翅膀',
    	                 'HBuilderX，轻巧、极速，极客编辑器',
    	                 'uni-app，终极跨平台方案',
    	                 '......'
    	             ],
    	             text: '',
    	             canAdd: true,
    	             canRemove: false,
    	             extraLine: []
    	         }
    	     },
    	     methods: {
    	         add: function(e) {
    	             this.extraLine.push(this.texts[this.extraLine.length % 12]);
    	             this.text = this.extraLine.join('\n');
    	             this.canAdd = this.extraLine.length < 12;
    	             this.canRemove = this.extraLine.length > 0;
    	         },
    	         remove: function(e) {
    	             if (this.extraLine.length > 0) {
    	                 this.extraLine.pop();
    	                 this.text = this.extraLine.join('\n');
    	                 this.canAdd = this.extraLine.length < 12;
    	                 this.canRemove = this.extraLine.length > 0;
    	             }
    	         }
    	     }
    	 }
    </script>
    
    <style>
    
    </style>

[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5bCP5bGB5a2p5aSn5biFLeadqOWwkeW5sw_size_20_color_FFFFFF_t_70_g_se_x_16]: /images/20220828/6ddb2495a9c348639a77fef48927d4ff.png