{{template "header" .}} <meta name="keywords" content="码农随笔,个人随笔,博客,个人博客,个人笔记,技术博客,免费云笔记,云笔记,随笔,IT博客,谷歌地图,码农笔录,aiprose"> <title>搜索 - 码农随笔</title> <script src="https://unpkg.com/dayjs@1.8.15/dayjs.min.js"></script> </head> <body> <div class="root-container"> {{template "nav" .}} <div class="search-root"> <div> <div> <div class="input-group input-class auto-screen"> <el-input v-model="searchVal" @change="searchHandler" placeholder="请输入关键字"></el-input> </div> </div> </div> <div class="search-result"> <div class="search-item" v-for="el in list"> <div class="search-title"> <a style="color: #28a3ef" :href="'https://www.aiprose.com/blog/' + el._source.Id " target="_blank">${el._source.Title}</a> <span class="auto-item"> ${mtime(el._source.Ctime)}</span> </div> <p class="search-content">${el._source.BlogDesc }</p> </div> <p v-if="list.length == 0">没有搜索到相关文章</p> </div> </div> </div> </body> <script> var app = new Vue({ el: ".root-container", delimiters: ['${', '}'], data: { searchVal: '', list: [], pageNo: 1, pageSize: 30, searchParms: { from: 0, size: 20, query: { multi_match: { query: "", // type: "best_fields", fields: ["Title", "BlogHtml"] } } } }, methods: { mtime (time){ return dayjs(time).format("YYYY-MM-DD") }, searchHandler (searchVal){ var _this = this; if (!searchVal || searchVal.trim().length == 0) { this.$Message.warning('请输入查询内容'); return } this.searchParms.query.multi_match.query = searchVal; var stringify = JSON.stringify(this.searchParms); $.ajax({ url: "https://www.aiprose.com/es/search", //请求的url地址 headers: {'Content-Type': 'application/json;charset=utf8'}, dataType: "json", //返回格式为json async: true,//请求是否异步,默认为异步,这也是ajax重要特性 data: stringify, //参数值 type: "POST", //请求方式 beforeSend: function () { //请求前的处理 }, success: function (resp) { _this.list = [] if (resp.hits.total != 0) { _this.list = resp.hits.hits; } //请求成功时处理 }, complete: function () { //请求完成的处理 }, error: function () { //请求出错处理 } }) } } }) $(function () { function search() { searchParms.query.multi_match.query = searchVal; var stringify = JSON.stringify(searchParms); } }) </script> </html>