목록미니프로그램-小程序/위챗-관광정보 앱 (17)
세모튜브

유튜브 강좌 : youtu.be/nj_lxIDKXNw github : https://github.com/semotube/korTourInfo semotube/korTourInfo Contribute to semotube/korTourInfo development by creating an account on GitHub. github.com refresh기능 추가 index.json : "enablePullDownRefresh": true 추가 index.js : onPullDownRefresh() 추가 및 reload기능 추가 { "usingComponents": {}, "enablePullDownRefresh": true } onLoad: function () { this.loadData(); }, ..

유튜브 강좌 : youtu.be/O1SnJQFcYkw github : https://github.com/semotube/korTourInfo semotube/korTourInfo Contribute to semotube/korTourInfo development by creating an account on GitHub. github.com 요청메세지 메뉴얼 지역,시군구 : 지역,시군구 코드 숙박선택 : 전체, 한옥, 베니키아, 굿스테이 => 선택시 1 아닐시 0 소스처리 initData() : code에 행사코드 전용 코드 받기 => init4Stay() change : stayChange() 추가 search : searchStay() 추가 initData(){ . . // 숙박검색 : Stay re..

유튜브강좌 : youtu.be/M2k5G30Up6A github : https://github.com/semotube/korTourInfo semotube/korTourInfo Contribute to semotube/korTourInfo development by creating an account on GitHub. github.com 아래 이미지를 확인해 보면 서비스분류를 검색조건에 넣을수 있다. 서비스분류도 넣어서 행사검색을 처리하도록 하자. 요청메세지 메뉴얼 서비스분류 : 메뉴얼에는 없지만 추가 지역,시군구 : 지역,시군구 코드 행사 시작일 : 형식 20200526 행사 종료일 : 형식 20200526 소스처리 initData() : code에 행사코드 전용 코드 받기 => init4Festiv..

유튜브 강좌 : youtu.be/lJel-nuZAoo github : https://github.com/semotube/korTourInfo 먼저 아래 이미지와 같이 검색부분에 즐겨찾기를 추가해서 사용하도록 하겠습니다. 즐겨찾기 추가/삭제 처리 detail.wxml에서 bindtap부분처리 소스처리 def.Favor : 즐겨찾기 스트링 정의 def.maxFavor : 즐겨찾기 갯수 100개 제한. app.globalData.detailItem : 리스트에 사용되는 데이터를 사용하기 위해... detail.js //즐겨찾기 처리 ////////////////////////////////////////////////////////////////////////////////////////////////////..

유튜브 강좌 : youtu.be/UIUgCOm75TA 우선 detailImage 오퍼레이션의 매뉴얼을 확인해봐야 한다. 기본적으로 요청 파라메터는 아래와 같다. 단, 음식점 타입일경우 컨텐츠 이미지 받은 다음 음식 이미지를 더 요구하자. 소스처리 onLoad: function (options) { console.log("options : ", options); this.detailCommon(options.contentid, options.contenttypeid); this.detailIntro(options.contentid, options.contenttypeid); this.detailImage(options.contentid, options.contenttypeid); }, . . . //이미지..

유튜브 강좌 : youtu.be/y0hXsEM2Zp8 우선 detailIntro 오퍼레이션의 매뉴얼을 확인해봐야 한다. 기본적으로 요청 파라메터는 특별한것은 없고 contentId, contentTypeId를 둘다 보내야 한다. 단, 아래 처럼 응답에 대해서는 contentTypeId 에 따라서 항목이 달라진다. 이부분을 을 이용해서 레이아웃을 다르게 표현해야 한다. contentTypeId = 12 : 관광지 contentTypeId = 14 : 문화시설 contentTypeId = 15 : 행사/공연/축제 contentTypeId = 25 : 여행코스 contentTypeId = 28 : 레포츠 contentTypeId = 32 : 숙박 contentTypeId = 38 : 쇼핑 contentType..

유튜브 강좌 : youtu.be/lZIDBWwUl2E 리스트에서 항목을 선택하면 세부정보를 보여주는 페이지를 구현해 보자 기본적으로 아래와 같이 처리하는것으로 하자. 별표아이콘 : 나의 즐겨찾기 on/off 공통정보 : detailCommon 오퍼레이션 이용 소개정보 : detailIntro 오퍼레이션 이용 추가이미지 : detailImage 오퍼레이션 이용 메뉴얼 참조 페이지 생성 "pages/search/detail/detail" 3가지 Tab처리 - 공통정보, 소개정보, 추가이미지 소스처리 // pages/search/detail/detail.js const api = require("../../../utils/api.js"); const util = require("../../../utils/ut..

유튜브 강좌 : youtu.be/MJYEUrchRsQ 서버에서 오는 항목에는 아래 이미지 처럼 html 데이터들도 존재한다. wxParse 미니프로그램에서 html를 출력하기 위해서 지원하는 parse가 있다. 다운로드 및 사용법 : https://github.com/icindy/wxParse 적용하기 우선 다운받은 소스를 아래 이미지 처럼 루트에 복사를 하자. 소스처리 detail 페이지 생성 : "pages/search/detail/detail" 상단에 WxParse를 선언해주고 본문에 WxParse.wxParse(변수명, 타입, html 데이타, this 또는 that, 이미지padding) 호출해서 html 데이타를 변환해서 변수에 저장한다. - imagePadding은 화면width값과 조절에서..

유튜브 강좌 : youtu.be/injntWItruQ WXS (WeiXin Script) : WXML와 함께 사용되는 스크립트 언어이다. 기본사용법은 아래 사이트를 참고. 참고사이트 : https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/ 날짜부분을 바꾸는데 활용해보자 우선 검색페이지(search.js)에서 서버에서 보내온 item을 보면 아래와 같다. 소스코드에 console.log("searchKeyword() item : ",item) 를 추가해서 콘솔에서 확인해 보면 createdtime: 20160429103816 => 생성날짜와시간인데 우린 이부분을 년월일만 사용하도록하자. 현재 아래 이미지 처럼 나온다. 아래 이미지 처럼 ..

유튜브 강좌 : youtu.be/3atwE76ax3g 조건식을 만들어 서버에 요청하기 - 첫화면 onShow()에서 "통합검색" "request" 처리하기 onShow() { let needSearch = false; if(this.data.tabArray[0].categoryArray[0].length === 0 || this.data.tabArray[0].areaArray[0].length === 0) { //재확인 this.initData(); //배열 초기화 후 다시 한번 확인. if(this.data.tabArray[0].categoryArray[0].length || this.data.tabArray[0].areaArray[0].length) needSearch = true; else retu..