l***@live.cn
l***@live.cn
  • 发布:2020-09-06 21:27
  • 更新:2020-09-06 21:28
  • 阅读:1181

uni-app中页面,查询数据库,并在载入时刷新,无法完成。。

分类:uni-app

我想做个简单的搜索,从数据库中搜索信息,然后载入到数组中。
我能在console.log 中得到数组的信息,但是页面却不能刷新生成。在getlist的function中能得到数组的信息。
页面上面不能生成?
sdlist这个数组,在哪里定义为好?感觉v-for直接从data()去找数据去了。
我想Data()中的数据从数据库中更新后,再显示。
刚开始学,请指教。
谢 谢了。
--代码见下面。

2020-09-06 21:27 负责人:无 分享
已邀请:
l***@live.cn

l***@live.cn (作者)

<template>  

    <view>    

    <view class="example-body">  
        <view class="content-text">  
            <text class="content-text">搜索关键词是(搜索TN):{{searchValue}}</text>  
            <text class="content-text">___共搜索到:{{scounters}} 项</text>  
        </view>  
        <uni-search-bar  v-model.trim="stitle" @confirm="search" @input="input" @cancel="cancel" />  
        </uni-search-bar>         
        <view class="search-result">  
            <text class="search-result-text">当前输入为:{{ stitle }}</text>  
        </view>  
    </view>  

    <uni-card v-for="(item,index) in sdlist" :key="item.id" :title="item.tn_title" isShadow @click="">  
    <text class="content-box-text">  
    {{item.tn_number}}----{{item.tn_title}}---{{item.tn_summary}}  
    </text>  
    </uni-card>  

    </view>  
    </template>  

<script>  
    // var searchValue;  
    var sdlist=[];  

    export default {      

            data() {  
            return {  
                stitle:'---kb-knowledge---',  
                searchValue:'',  
                scounters:0,  
                sdlist:[],  

                // scdlist:[  
                // {id:0,tn_number:'ddsd',tn_title:'ddada',tn_summary:'asdasdasd'},  
                // // {id:1,tn_number:'',tn_title:'',tn_summary:''},  
                // // {id:2,tn_number:'',tn_title:'',tn_summary:''},  
                // // {id:3,tn_number:'',tn_title:'',tn_summary:''},  
                // ],  
            }  
        },  

        // onLoad (e) {  
    onLoad: function (option) {  
        uni.setNavigationBarTitle({  
           title: 'knowledge---搜索TN---'  
        });  

            console.log('tabbar-2_onload页面-准备开始searching:');              

            uni.getStorage({  
                key: 'search_key',  
                    success: function (res) {  
                    // var searchVal= res.data;  
                    console.log("取得存储的res.data是:"+res.data);  
                    // console.log("search val是:"+searchVal);  
                    this.searchValue =res.data;  
                    // this.ss1=res.data;  
                    getApp().globalData.search_text = res.data;  
                    // console.log('this.searchvalue 是:'+this.searchVal);  
                    }  
                          });  

        this.searchValue=getApp().globalData.search_text;  
        console.log('this.searchvalue_out_of_onload是:........'+getApp().globalData.search_text);  
        console.log(this.searchValue);  
        //  
        // var ccounters=0;  
        // var sdlist=[];  
        this.getlist();  

        },  

        onShow() {  
        this.searchValue=getApp().globalData.search_text;     
        // 统计搜索出来的数据量  
        // this.getlist();  
        },  

        methods: {  
        getlist (){  
            //开始设计getlist             
            // var ccounters=0;  
            // var sdlist=[];  
            plus.sqlite.selectSql({  
                    name: 'test_DB',  
                    // sql: "select * from tn_note where summary like"+ "'%"searchValue+"%'"+"limit 3",  
                    sql: "select * from tn_note where summary like"+ "'%"+this.searchValue+"%'"+"limit 5",  
                    // sql: 'SELECT * FROM sqlite_master where type ="table"',  
                    success: function(data){  
                        // console.log('..........selectSql success-选择查询成功.要查询的是......');  
                        for(var i in data){  
                            // console.info('开始打印数据:'+JSON.stringify(data[i].title));  
                            console.info('-----开始打印数据---'+i+'---tn号--:'+JSON.stringify(data[i].tn_number)+'---标题--:'+JSON.stringify(data[i].title));  
                            this.scounters++;  
                        sdlist.push({    
                        id: data[i].rowid,    
                        tn_number: JSON.stringify(data[i].tn_number),    
                        tn_title: JSON.stringify(data[i].title),    
                        tn_summary: JSON.stringify(data[i].category),    
                        // published_at: dateUtils.format(e.published_at),                            
                        });   
                        // console.log('----------成功保存至sdlist数组--------');  
                        console.log('---sdlist数组中的----'+i +'------'+ sdlist[i].tn_title);                     
                        };  
                        console.log('共生成数据的行数:----'+this.scounters+'-------行');  

                    },  
                    fail: function(e){  
                        console.log('selectSql failed-选择查询失败: '+JSON.stringify(e));  
                    }  
                    });   
            return sdlist,scounters;  
            //开始设计getlist--结束  
            },  

        search(res) {  
            uni.showToast({  
                title: '搜索:' + res.value,  
                icon: 'none'  
            })  
            this.getlist();  
        },  
        input(res) {  
            this.stitle = res.value;  
            console.log('开始输入中');  
        },  
        cancel(res) {  
            uni.showToast({  
                title: '点击取消,输入值为:' + res.value,  
                icon: 'none'  
            })  
        },  

        },  
        onBackPress() {  
            // #ifdef APP-PLUS  
            plus.key.hideSoftKeybord();  
            // #endif  
        }  
    }  
</script>  

<style>  
    .btn-setstorage {  
        background-color: #007aff;  
        color: #ffffff;  
    }  
    .content {  
        text-align: left;  
        height: 20upx;  
        margin-left: 40upx;  
        margin-top: 40upx;  
    }  
    .content-text {  
        flex-direction: row;  
        justify-content: left;  
        align-items: left;  
        font-size: 14px;  
        line-height: 20px;  
    }  
</style>  

该问题目前已经被锁定, 无法添加新回复