vue中文本域限制字数的方法
用watch方法,来限制字数
<template>
<div class="box">
<textarea v-model="title" width="100%" ></textarea>
<span>还可以输入{{this.titleMaxLength - this.title.length}}</span>
</div>
</template>
<script>
export default {
name: 'Box',
data() {
return {
title: '',
titleMaxLength: 60
};
},
methods:{
},
watch: {
title() {
if (this.title.length > this.titleMaxLength) {
this.title = String(this.title).slice(0, this.titleMaxLength);
}
}
}
}
</script>
<style lang="less">
.box{
width: 100%;
textarea{
width: 100%;
height: 60px;
border: none;
outline: none;
box-sizing: border-box;
}
}
</style>
vue中文本域限制字数的方法的更多相关文章
- vue中使用echarts的两种方法
在vue中使用echarts有两种方法一.第一种方法1.通过npm获取echarts npm install echarts --save 2.在vue项目中引入echarts 在 main.js 中 ...
- vue中push()和splice()的使用方法
vue中push()和splice()的使用方法 push()使用 push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度.注意:1. 新元素将添加在数组的末尾. 2.此方法改变数组的长度 ...
- vue中常见的问题以及解决方法
有一些问题不限于 Vue,还适应于其他类型的 SPA 项目. 1. 页面权限控制和登陆验证 页面权限控制 页面权限控制是什么意思呢? 就是一个网站有不同的角色,比如管理员和普通用户,要求不同的角色能访 ...
- 用Vue中遇到的问题和处理方法(一)
用Vue开发项目有一段时间,在实际项目中遇到一些问题,在里把问题记录下来,并附上解决方案,给遇到同样的问题的码友提供一个解决思路吧: 测试部抛出问题一:在Vue1.0路由vue-router中,当点击 ...
- 用Vue中遇到的问题和处理方法
用Vue开发项目有一段时间,在实际项目中遇到一些问题,在里把问题记录下来,并附上解决方案,给遇到同样的问题的码友提供一个解决思路吧: 测试部抛出问题一:在Vue1.0路由vue-router中,当点击 ...
- vue中如何引入全局样式或方法
vue中我么会经常用到通用的一些全局的方法,如何左才能实现全局的复用减少代码累赘呢? 我们一般将公用的方法分装再utils.js文件中,然后再main.js主入口文件中将utils.js中的公共的方法 ...
- 解决Vue中文本输入框v-model双向绑定后数据不显示的问题
前言 项目中遇到一个问题就是在Vue中双向绑定对象属性时,手动赋值属性后输入框的数据不实时更新的问题. <FormItem label="地址" prop="eve ...
- Vue中组件通信的几种方法(Vue3的7种和Vue2的12种组件通信)
Vue3组件通信方式: props $emit expose / ref $attrs v-model provide / inject Vuex 使用方法: props 用 props 传数据给子组 ...
- 在vue中使用sass的配置的方法
1.安装sass的依赖包 npm install --save-dev sass-loader //sass-loader依赖于node-sass npm install --save-dev nod ...
随机推荐
- Go 基础(非常基础)
// package main 和 main 函数 package main func main() {} //每一个.go文件都需要有 package 关键词,并且声明在文件顶部 package p ...
- 2019湘潭校赛 H(dp)
题目传送 dp是常规的:\(m^2\)的预处理:把位置存进vector然后\(O(1)\)算出想要的:WA点:要注意特意设置一下val[i][v.size()]=0,即全天都放鸽子则花费时间为0. # ...
- codeforces840E In a Trap
好巧妙啊,感觉从来没有用过按位dp的trick,也没有用过树上链分块的trick 挂个链,全程看他的思路写的,当然lych帮我理解了最难懂的一部分 首先这里有个玄学的分块 每个点统计它上面256(其实 ...
- hdu4570-区间dp
这道题的题意不是一般的难懂啊,各种查字典都没理解,还是没忍住去看了别人的博客,没想到题很简单,1-n内划分若干个区间,使的每个区间和最小,每个区间的区间和是:区间开头的数*2^区间长度. 区间dp # ...
- HDU 1260 Tickets DP
http://acm.hdu.edu.cn/showproblem.php?pid=1260 用dp[i]表示处理到第i个的时候用时最短. 那么每一个新的i,有两个选择,第一个就是自己不和前面的组队, ...
- win10红警黑屏和无法打开的处理
原因:win10或者win7无法打红警的原因,除开软件本身坏了等情况,多半是因为显示比率不对不上和系统不兼容导致的处理方法是: 1.将快捷方式发送到桌面(只是为了方便打开,当然你也可以不发送到桌面,关 ...
- c#基础值类和引用类型
//值类型:int double char decimal bool enum struct //引用类型:string 数组 自定义类 集合 object 接口 值传递传递的值得本身 引用传递传递的 ...
- swift3.0 项目引导页
项目引导页并不难,使用 UICollectionView就可以完成, 1.首先获取应用程序的版本号,并存入本地,每次有新版本号,和存入本地的版本号,相比较 fileprivate func setup ...
- Spring的七种事务传播机制
概述 当我们调用一个基于Spring的Service接口方法(如UserService#addUser())时,它将运行于Spring管理的事务环境中,Service接口方法可能会在内部调用其它的Se ...
- POJ3252Round Numbers(数位dp)
题意 给出区间$[A, B]$,求出区间内的数转成二进制后$0$比$1$多的数的个数 $1 \leqslant A, B \leqslant 2,000,000,000$ Sol 比较zz的数位dp ...