zoukankan      html  css  js  c++  java
  • uni-app 文本域,v-model 双向绑定操作

    <template>
        <view>
            <!-- 自定义导航栏 -->
            <uni-nav-bar :statusBar="true" rightText="发布" left-icon="back" @click-left="back" @click-right="submit">
                <view class="u-f-ajc" @tap="changelook">
                    {{yinsi}}
                    <view class="icon iconfont icon-xialazhankai"></view>
                </view>
            </uni-nav-bar>
            <!-- 多行输入框 -->
            <view class="uni-textarea">
                <textarea v-model="text" placeholder="说一句话吧~" />
            </view>
            
            
            
        </view>
    </template>
    
    <script>
        let changelook= ['所有人可见', '仅自己可见'];
        import uniNavBar from "../../components/uni-nav-bar/uni-nav-bar.vue";
        export default {
            components:{
                uniNavBar
            },
            data() {
                return {
                    yinsi:"所有人可见",
                    text:""
                };
            },
            methods:{
                // 返回
                back(){
                    uni.navigateBack({ delta: 1 });
                },
                // 发布
                submit(){
                    console.log("发布")
                },
                // 隐私
                changelook(){
                    uni.showActionSheet({
                        itemList:changelook,
                        success: (res)=> {
                            this.yinsi=changelook[res.tapIndex]
                        }
                    });
                }
            }
        }
    </script>
    
    <style>
    .uni-textarea{
        border: 1upx solid #EEEEEE;
    }
    </style>
  • 相关阅读:
    4.8日学习
    Apache安装
    HTML5 review
    个人阅读作业LAST
    个人阅读作业Week7
    结对编程:界面模块总结
    个人博客作业Week3
    结对编程博客
    个人博客week2
    软工第一次作业简单总结
  • 原文地址:https://www.cnblogs.com/zxyun/p/13815661.html
Copyright © 2011-2022 走看看