AI智能
改变未来

【uni-app 怎么获取input里的数据,怎么修改input的placeholder样式】


uni-app 怎么获取input里的数据,怎么修改input的placeholder样式

1.写两个input标签,获取值变化,提示信息,提示样式

<template><view><comeBack text_name=\"日记本\"></comeBack><view class=\"input \" ><input type=\"text\" @blur=\"title\" placeholder=\"日记标题\" placeholder-class=\"col_c\" maxlength=\"50\"  class=\"mle20 wth90\"/></view><view class=\"input\"><textarea @blur=\"con\" placeholder=\"日记内容\" placeholder-class=\"col_c\" class=\"mle20 wth90\" /></view><view class=\"mto30\"><view class=\"fle_all btn\" style=\"padding: 20rpx;\" @tap=\"kee_btn\"><text class=\"let3 fon4_cen\">提交</text></view></view></view></template>

2.获取值变化的内容存起来,在点击提交的时候就可以传过去啦

<script>import comeBack from \"../../component/come-back/come-back.vue\"export default {components:{comeBack},data() {return {diary:{title:\'\',con:\'\'}}},methods: {kee_btn(){console.log(this.diary)},title(e) {this.diary.title = e.detail.value},con(e) {this.diary.con = e.detail.value},}}</script>
<style>.input{box-shadow:0px 0px 14px 2px rgba(183,198,222,0.7);margin: 20rpx;padding: 15rpx;border-radius: 10rpx;}.btn{background-color: #FE9236;margin: 0% 3%;border-radius: 25rpx;color: white;}.col_c{color: #ccc;}.mle20{margin-left: 20rpx;}.wth90{width: 90%;}.fle_all{display: flex;align-items: center;justify-content: center;}</style>

····博主标签的样式

赞(0) 打赏
未经允许不得转载:爱站程序员基地 » 【uni-app 怎么获取input里的数据,怎么修改input的placeholder样式】