【vue】封装的天气展示卡片,在线获取天气信息

源码

<template><div class="sen_weather_wrapper"><div class="sen_top_box"><div class="sen_left_box"><div class="sen_top"><div class="sen_city">山东</div><qctc-time class="sen_time_box"></qctc-time></div><div class="sen_bot"><div class="sen_current">{{ weatherObj.tempData }}<span>℃</span></div><div class="sen_currentDays"><el-image style="width: 1.8rem; height: 1.8rem;margin-right: 5px;":src="weatherObj.weatherImg" fit="cover"/><div>{{ weatherObj.minTemperature }}℃<spanstyle="margin: 0 5px;">~</span>{{ weatherObj.maxTemperature }}℃</div></div></div></div><div class="sen_right_box"><span>风速:{{ weatherObj.degData }}{{ weatherObj.windspeed }}级</span><span>湿度:{{ weatherObj.humidity }}%</span><span>降水量:{{ weatherObj.rainfall }}毫米</span></div></div><div class="sen_bot_box"><div class="list_box" v-for="(item,index) in weatherList"><div class="text_box">{{ item.day }}</div><div class="text_box">{{ item.date }}</div><div class="text_box">{{ item.description }}</div><div class="img_box"><div class="" v-if="item.description == '晴'"><svg version="1.1" id="sunGlobe" xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100"enable-background="new 0 0 100 100" xml:space="preserve"><g id="sunrays"><radialGradient id="XMLID_4_" cx="51.1566" cy="21.1667" r="4.7267"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_3_" fill="url(#XMLID_4_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M56.1,25.3h-9.7c0,0-1.2-6.1,0-7.4c1.2-1.3,8.9-1,9.7,0C56.8,18.9,56.1,25.3,56.1,25.3z"/><radialGradient id="XMLID_12_" cx="71.2457" cy="29.7708" r="6.0292"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_5_" fill="url(#XMLID_12_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M71.8,35.8l-6.6-7.1c0,0,3.7-5,5.4-5.1s6.8,5.8,6.6,7.1C77.1,32,71.8,35.8,71.8,35.8z"/><radialGradient id="XMLID_13_" cx="79.016" cy="49.1667" r="4.757"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_6_" fill="url(#XMLID_13_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M75.1,54.2l-0.3-9.7c0,0,6.1-1.3,7.4-0.2c1.3,1.1,1.2,8.9,0.3,9.7C81.5,54.8,75.1,54.2,75.1,54.2z"/><radialGradient id="XMLID_14_" cx="70.2457" cy="69.6002" r="6.0234"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_7_" fill="url(#XMLID_14_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M64.3,70.7l6.4-7.2c0,0,5.3,3.2,5.5,4.9c0.2,1.7-5.2,7.3-6.4,7.2C68.5,75.6,64.3,70.7,64.3,70.7z"/><radialGradient id="XMLID_15_" cx="50.7987" cy="78.0712" r="4.7789"gradientTransform="matrix(0.998 -6.322496e-002 6.322496e-002 0.998 -4.8396 3.3703)"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_8_" fill="url(#XMLID_15_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M45.8,74.2l9.7-0.2c0,0,1.3,6.1,0.2,7.4c-1.1,1.3-8.9,1.2-9.7,0.2C45.2,80.6,45.8,74.2,45.8,74.2z"/><radialGradient id="XMLID_16_" cx="30.5864" cy="70.2252" r="6.0153"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_9_" fill="url(#XMLID_16_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M29.3,64.3l7.3,6.3c0,0-3.1,5.4-4.8,5.6s-7.4-5-7.3-6.3C24.6,68.6,29.3,64.3,29.3,64.3z"/><radialGradient id="XMLID_44_" cx="21.0871" cy="50" r="4.8093"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_10_" fill="url(#XMLID_44_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M24.8,44.8l0.6,9.6c0,0-6,1.5-7.4,0.5c-1.4-1.1-1.5-8.8-0.6-9.6C18.3,44.4,24.8,44.8,24.8,44.8z"/><radialGradient id="XMLID_45_" cx="29.9614" cy="29.0073" r="6.019"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#FBD25A"/><stop offset="0.7581" style="stop-color:#FAD45D"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><path id="XMLID_11_" fill="url(#XMLID_45_)" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" d="M36,28.6L28.7,35c0,0-4.9-3.8-4.9-5.6c0-1.7,6.1-6.6,7.3-6.3C32.4,23.3,36,28.6,36,28.6z"/></g><radialGradient id="XMLID_46_" cx="50" cy="49.1667" r="26.8776"gradientUnits="userSpaceOnUse"><stop offset="0.3333" style="stop-color:#E3BF4C"/><stop offset="0.7473" style="stop-color:#F4CE52"/><stop offset="1" style="stop-color:#F5E16E"/></radialGradient><ellipse id="XMLID_1_" fill="url(#XMLID_46_)" stroke="#58595B" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="50" cy="49.2" rx="27.3"ry="26.5"/></svg></div><div class="" v-if="item.description == '多云'"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100"xml:space="preserve"><g id="Layer_4"><radialGradient id="chubbyMoon_1_" cx="73.25" cy="20.1667" r="71.3092"gradientUnits="userSpaceOnUse"><stop offset="0.4082" style="stop-color:#D3D0B2"/><stop offset="0.42" style="stop-color:#C5C4A0"/></radialGradient><ellipse id="chubbyMoon" fill="url(#chubbyMoon_1_)" stroke="#58595B" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="61.8" cy="31.2" rx="27.3"ry="26.5"/><radialGradient id="mooncrater_2_" cx="248.5072" cy="171.0079" r="71.3092"gradientTransform="matrix(0.2761 0 0 0.2761 -4.5736 -17.9305)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater" fill="url(#mooncrater_2_)" stroke="#58595B" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="60.9" cy="32.3" rx="7.5"ry="7.3"/><radialGradient id="mooncrater_4_" cx="328.3989" cy="-40.7337" r="71.3092"gradientTransform="matrix(7.215338e-002 0 0 7.215340e-002 25.6009 15.7241)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater_1_" fill="url(#mooncrater_4_)" stroke="#58595B"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="48.5"cy="13.6" rx="2" ry="1.9"/><radialGradient id="mooncrater_6_" cx="455.6206" cy="33.6355" r="71.3092"gradientTransform="matrix(0.1198 0 0 0.1198 13.506 8.4935)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater_3_" fill="url(#mooncrater_6_)" stroke="#58595B"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="66.7"cy="13.8" rx="3.3" ry="3.2"/><radialGradient id="mooncrater_7_" cx="532.6715" cy="160.4353" r="71.3092"gradientTransform="matrix(0.1405 0 0 0.1405 6.587 5.366)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater_5_" fill="url(#mooncrater_7_)" stroke="#58595B"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="79.8"cy="29.4" rx="3.8" ry="3.7"/><radialGradient id="mooncrater_10_" cx="236.5847" cy="186.8517" r="71.3092"gradientTransform="matrix(0.1712 0 0 0.1712 2.2486 -2.7871)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater_8_" fill="url(#mooncrater_10_)" stroke="#58595B"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="40.8"cy="31.1" rx="4.7" ry="4.5"/><radialGradient id="mooncrater_12_" cx="315.6328" cy="235.365" r="71.3092"gradientTransform="matrix(0.1135 0 0 0.1135 12.8171 17.5574)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater_9_" fill="url(#mooncrater_12_)" stroke="#58595B"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="47.3"cy="45.5" rx="3.1" ry="3"/><radialGradient id="mooncrater_13_" cx="500.9887" cy="293.8005" r="71.3092"gradientTransform="matrix(0.1135 0 0 0.1135 12.8171 17.5574)"gradientUnits="userSpaceOnUse"><stop offset="0.385" style="stop-color:#C2B99D"/><stop offset="0.4082" style="stop-color:#B5AA86"/></radialGradient><ellipse id="mooncrater_11_" fill="url(#mooncrater_13_)" stroke="#58595B"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="7.000000e-002" cx="68.4"cy="52.2" rx="3.1" ry="3"/></g><g id="smallcloud"><path id="XMLID_3_" fill="#5BCAEB" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002" d="M19,39.9c0,0,5.7,1.7,7-1.2c5.4,3,9.1,0.6,11.5,0c0.5,2.3,6.1,1.2,6.1,1.2s10.7-2.6,9.9-11.7c0,0-1.9-12.4-14-10c0,0-9.7-9.5-18.6,2.5c0,0-9-0.5-10.3,10C10.6,30.7,10.9,37.8,19,39.9z"/></g><g id="bigCloud"><path id="XMLID_9_" fill="#F4F4F4" stroke="#515251" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002"d="	M22.3,65.5c0,0-8.9-2.9-9.3-12.8s10-11.3,11.4-10.1c0,0,2.5-8.4,10.1-8.6c0,0,3.5-13.4,17.8-13.1c0,0,15.6-0.8,17.9,16.4c0,0,12.9-1,13.4,15.1c0,0-1.4,10.9-11.9,13.1c0,0-12,2-13.8-2.3c-0.2,2.1-15,6-19.6,0C33.8,68.4,22.3,65.5,22.3,65.5z"/></g></svg></div><div class=""v-if="item.description == '小雨' || item.description == '中雨' || item.description == '大雨'"><svg class="svg" version="1.1" xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100"enable-background="new 0 0 100 100" xml:space="preserve"><g id="rain"><path class="raindrop" id="drop1" fill="url(#XMLID_19_)" stroke="#000000"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="0.5" d="M33.8,67.2c0,0-10.4,14.3,0,14.3C44.4,81.5,33.8,67.2,33.8,67.2z"/><path class="raindrop" id="drop2" fill="url(#XMLID_19_)" stroke="#000000"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="0.5" d="M48.2,67c0,0-10.4,14.3,0,14.3C58.8,81.3,48.2,67,48.2,67z"/><linearGradient id="XMLID_19_" gradientUnits="userSpaceOnUse" x1="57.7887" y1="74.1052"x2="67.118" y2="74.1052"><stop offset="0.4718" style="stop-color:#5CCAEB"/><stop offset="0.5339" style="stop-color:#51B1CD"/></linearGradient><path class="raindrop" id="drop3" fill="url(#XMLID_19_)" stroke="#000000"stroke-width="0.5" stroke-miterlimit="10" stroke-opacity="0.5" d="M62.4,67c0,0-10.4,14.3,0,14.3C73,81.3,62.4,67,62.4,67z"/></g><g id="bigCloudRain"><path id="XMLID_1_" fill="#F4F4F4" stroke="#515251" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002"d="M22.3,65.5c0,0-8.9-2.9-9.3-12.8s10-11.3,11.4-10.1c0,0,2.5-8.4,10.1-8.6c0,0,3.5-13.4,17.8-13.1c0,0,15.6-0.8,17.9,16.4c0,0,12.9-1,13.4,15.1c0,0-1.4,10.9-11.9,13.1c0,0-12,2-13.8-2.3c-0.2,2.1-15,6-19.6,0C33.8,68.4,22.3,65.5,22.3,65.5z"/></g></svg></div><div class="" v-if="item.description == '阴'"><svg class="svg" version="1.1" xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100"enable-background="new 0 0 100 100" xml:space="preserve"><g id="bigCloudRain"><path id="XMLID_1_" fill="#F4F4F4" stroke="#515251" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002"d="M22.3,65.5c0,0-8.9-2.9-9.3-12.8s10-11.3,11.4-10.1c0,0,2.5-8.4,10.1-8.6c0,0,3.5-13.4,17.8-13.1c0,0,15.6-0.8,17.9,16.4c0,0,12.9-1,13.4,15.1c0,0-1.4,10.9-11.9,13.1c0,0-12,2-13.8-2.3c-0.2,2.1-15,6-19.6,0C33.8,68.4,22.3,65.5,22.3,65.5z"/></g></svg></div><div class="" v-if="item.description == '雷阵雨'"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100"xml:space="preserve"><g id="thunder"><polygon fill="#FAC73F"points="45.6,61.5 39.4,77.6 47.6,77.4 43.1,91.9 44.3,91.9 59.3,73.5 51.4,73.4 58.7,61.5 	"/></g><g id="smallcloud"><path id="XMLID_3_" fill="#F4F4F4" stroke="#6D6E71" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002" d="M19,39.9c0,0,5.7,1.7,7-1.2c5.4,3,9.1,0.6,11.5,0c0.5,2.3,6.1,1.2,6.1,1.2s10.7-2.6,9.9-11.7c0,0-1.9-12.4-14-10c0,0-9.7-9.5-18.6,2.5c0,0-9-0.5-10.3,10C10.6,30.7,10.9,37.8,19,39.9z"/></g><g id="bigClouds"><path id="XMLID_16_" fill="#F4F4F4" stroke="#515251" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002"d="M22.3,65.5c0,0-8.9-2.9-9.3-12.8s10-11.3,11.4-10.1c0,0,2.5-8.4,10.1-8.6c0,0,3.5-13.4,17.8-13.1c0,0,15.6-0.8,17.9,16.4c0,0,12.9-1,13.4,15.1c0,0-1.4,10.9-11.9,13.1c0,0-12,2-13.8-2.3c-0.2,2.1-15,6-19.6,0C33.8,68.4,22.3,65.5,22.3,65.5z"/></g></svg></div><div class=""v-if="item.description == '小雪' || item.description == '中雪' || item.description == '大雪'"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100"xml:space="preserve"><g id="snowflakes"><g id="flake3"><path fill="#5BCAEB" d="M72,78.1c0.6,0.6,0.6,1.6,0,2.2l0,0c-0.6,0.6-1.6,0.6-2.2,0l-8.7-8.7C60.5,71,60.3,70,61,69.3s1.7-0.4,2.3,0.2L72,78.1z"/><path fill="#5BCAEB" d="M63.1,80.3c-0.6,0.6-1.6,0.6-2.2,0l0,0c-0.6-0.6-0.6-1.6,0-2.2l8.7-8.7c0.6-0.6,1.7-0.8,2.3-0.2c0.7,0.7,0.4,1.7-0.2,2.3L63.1,80.3z"/><path fill="#5BCAEB" d="M60.2,76.3c-0.9,0-1.5-0.7-1.5-1.5l0,0c0-0.9,0.7-1.5,1.5-1.5h12.3c0.9,0,1.8,0.6,1.8,1.5c0,0.9-0.9,1.5-1.8,1.5H60.2z"/><path id="XMLID_8_" fill="#5BCAEB" d="M68,81c0,0.9-0.7,1.5-1.5,1.5l0,0c-0.9,0-1.5-0.7-1.5-1.5V68.8c0-0.9,0.6-1.8,1.5-1.8c0.9,0,1.5,0.9,1.5,1.8V81z"/></g><g id="flake2"><path fill="#5BCAEB" d="M53.5,78.1c0.6,0.6,0.6,1.6,0,2.2l0,0c-0.6,0.6-1.6,0.6-2.2,0l-8.7-8.7C42,71,41.8,70,42.5,69.3c0.7-0.7,1.7-0.4,2.3,0.2L53.5,78.1z"/><path fill="#5BCAEB" d="M44.6,80.3c-0.6,0.6-1.6,0.6-2.2,0l0,0c-0.6-0.6-0.6-1.6,0-2.2l8.7-8.7c0.6-0.6,1.7-0.8,2.3-0.2c0.7,0.7,0.4,1.7-0.2,2.3L44.6,80.3z"/><path fill="#5BCAEB" d="M41.7,76.3c-0.9,0-1.5-0.7-1.5-1.5l0,0c0-0.9,0.7-1.5,1.5-1.5H54c0.9,0,1.8,0.6,1.8,1.5c0,0.9-0.9,1.5-1.8,1.5H41.7z"/><path id="XMLID_17_" fill="#5BCAEB" d="M49.5,81c0,0.9-0.7,1.5-1.5,1.5l0,0c-0.9,0-1.5-0.7-1.5-1.5V68.8c0-0.9,0.6-1.8,1.5-1.8c0.9,0,1.5,0.9,1.5,1.8V81z"/></g><g id="flake1"><path fill="#5BCAEB" d="M35.1,78.1c0.6,0.6,0.6,1.6,0,2.2l0,0c-0.6,0.6-1.6,0.6-2.2,0l-8.7-8.7c-0.6-0.6-0.8-1.7-0.2-2.3c0.7-0.7,1.7-0.4,2.3,0.2L35.1,78.1z"/><path fill="#5BCAEB" d="M26.3,80.3c-0.6,0.6-1.6,0.6-2.2,0l0,0c-0.6-0.6-0.6-1.6,0-2.2l8.7-8.7c0.6-0.6,1.7-0.8,2.3-0.2c0.7,0.7,0.4,1.7-0.2,2.3L26.3,80.3z"/><path fill="#5BCAEB" d="M23.4,76.3c-0.9,0-1.5-0.7-1.5-1.5l0,0c0-0.9,0.7-1.5,1.5-1.5h12.3c0.9,0,1.8,0.6,1.8,1.5c0,0.9-0.9,1.5-1.8,1.5H23.4z"/><path fill="#5BCAEB" d="M31.1,81c0,0.9-0.7,1.5-1.5,1.5l0,0c-0.9,0-1.5-0.7-1.5-1.5V68.8c0-0.9,0.6-1.8,1.5-1.8s1.5,0.9,1.5,1.8V81z"/></g></g><g id="bigCloudSnow"><path id="XMLID_1_" fill="#F4F4F4" stroke="#515251" stroke-width="0.5"stroke-miterlimit="10" stroke-opacity="8.000000e-002"d="M22.3,65.5c0,0-8.9-2.9-9.3-12.8s10-11.3,11.4-10.1c0,0,2.5-8.4,10.1-8.6c0,0,3.5-13.4,17.8-13.1c0,0,15.6-0.8,17.9,16.4c0,0,12.9-1,13.4,15.1c0,0-1.4,10.9-11.9,13.1c0,0-12,2-13.8-2.3c-0.2,2.1-15,6-19.6,0C33.8,68.4,22.3,65.5,22.3,65.5z"/></g></svg></div><!-- <el-image style="width: 3rem; height: 3rem;":src="item.weatherImg" fit="cover" /> --></div><div class="text_box1">{{ item.minTemperature }}℃<spanstyle="margin: 0 5px;">~</span>{{ item.maxTemperature }}℃</div></div><div class="chart_box"><q-charts :option="weatherOption"></q-charts></div></div></div>
</template>

资料包:https://download.csdn.net/download/galaxyJING/89331774

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/331190.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

unreal engine 5.0.3 创建游戏项目

根据虚幻官网介绍&#xff0c;虚幻引擎5可免费用于创建线性内容、定制项目和内部项目。你可以免费用它开发游戏&#xff0c;只有当你的产品营收超过100万美元时&#xff0c;才收取5%的分成费用。所以目前国内也有许多游戏厂商在使用UE制作游戏。UE5源码也已开源&#xff0c;有U…

多线程(C++11)

多线程&#xff08;C&#xff09; 文章目录 多线程&#xff08;C&#xff09;前言一、std::thread类1.线程的创建1.1构造函数1.2代码演示 2.公共成员函数2.1 get_id()2.2 join()2.3 detach()2.4 joinable()2.5 operator 3.静态函数4.类的成员函数作为子线程的任务函数 二、call…

解释JAVA语言中关于方法的重载

在JAVA语言中&#xff0c;方法的重载指的是在同一个类中可以存在多个同名方法&#xff0c;但它们的参数列表不同。具体来说&#xff0c;重载的方法必须满足以下至少一条条件: 1. 参数个数不同。 2. 参数类型不同。 3. 参数顺序不同。 当调用一个重载方法时&#xff0c;编译器…

MyBatis 学习笔记(一)

MyBatis 封装 JDBC :连接、访问、操作数据库中的数据 MyBatis 是一个持久层框架。 MyBatis 提供的持久层框架包括 SQLMaps 和 Data Access Objects&#xff08;DAO&#xff09; SQLMaps&#xff1a;数据库中的数据和 Java数据的一个映射关系 封装 JDBC 的过程Data Access Ob…

东哥一句兄弟,你还当真了?

关注卢松松&#xff0c;会经常给你分享一些我的经验和观点。 你还真把自己当刘强东兄弟了?谁跟你是兄弟了?你在国外的房子又不给我住&#xff0c;你出去旅游也不带上我!都成人年了&#xff0c;东哥一句客套话&#xff0c;别当真! 今天&#xff0c;东哥在高管会上直言&…

计算机网络套接字知识(非常详细)从零基础入门到精通

本节重点 认识IP地址, 端口号, 网络字节序等网络编程中的基本概念; 学习socket api的基本用法; 一、预备知识 1.理解源IP地址和目的IP地址 ⭐在IP数据包头部中&#xff0c;有两个IP地址&#xff0c;分别叫做源IP地址和目的IP地址。 思考: 我们光有IP地址就可以完成通信了…

深入理解NumPy与Pandas【numpy模块及Pandas模型使用】

二、numpy模块及Pandas模型使用 numpy模块 1.ndarray的创建 import numpy as np anp.array([1,2,3,4]) bnp.array([[1,2,3,4],[5,6,7,8]]) print(a) #[1 2 3 4] print(b) #[[1 2 3 4][5 6 7 8]] 1.1使用array()函数创建 numpy.array(object, dtype None, copy True, ord…

CentOS 7安装/卸载Grafana

说明&#xff1a;本文介绍CentOS 7操作系统如何安装/卸载Grafana&#xff1b; 安装 Step1&#xff1a;下载rpm文件 敲下面的命令&#xff0c;下载grafana的rpm文件 wget https://dl.grafana.com/oss/release/grafana-7.3.7-1.x86_64.rpmStep2&#xff1a;安装grafana 敲下…

Redis常见数据类型(6)-set, zset

目录 Set 命令小结 内部编码 使用场景 用户画像 其它 Zset有序集合 普通指令 zadd zcard zcount zrange zrevrange ​编辑 zrangebyscore zpopmax/zpopmin bzpopmax/bzpopmin zrank/zrevrank zscore zrem zremrangebyrank zremrangebyscore Set 命令小结 …

图像上下文学习|多模态基础模型中的多镜头情境学习

【原文】众所周知&#xff0c;大型语言模型在小样本上下文学习&#xff08;ICL&#xff09;方面非常有效。多模态基础模型的最新进展实现了前所未有的长上下文窗口&#xff0c;为探索其执行 ICL 的能力提供了机会&#xff0c;并提供了更多演示示例。在这项工作中&#xff0c;我…

以太坊(3)——智能合约

智能合约 首先明确一下几个说法&#xff08;说法不严谨&#xff0c;为了介绍清晰才说的&#xff09;&#xff1a; 全节点矿工 节点账户 智能合约是基于Solidity语言编写的 学习Solidity语言可以到WFT学院官网&#xff08;Hello from WTF Academy | WTF Academy&#xff09;…

Go语言的内存泄漏如何检测和避免?

文章目录 Go语言内存泄漏的检测与避免一、内存泄漏的检测1. 使用性能分析工具2. 使用内存泄漏检测工具3. 代码审查与测试 二、内存泄漏的避免1. 使用defer关键字2. 使用垃圾回收机制3. 避免循环引用4. 使用缓冲池 Go语言内存泄漏的检测与避免 在Go语言开发中&#xff0c;内存泄…

Linux基础(五):常用基本命令

从本节开始&#xff0c;我们正式进入Linux的学习&#xff0c;通过前面的了解&#xff0c;我们知道我们要以命令的形式使用操作系统&#xff08;使用操作系统提供的各类命令&#xff0c;以获得字符反馈的形式去使用操作系统。&#xff09;&#xff0c;因此&#xff0c;我们是很有…

win32-鼠标消息、键盘消息、计时器消息、菜单资源

承接前文&#xff1a; win32窗口编程windows 开发基础win32-注册窗口类、创建窗口win32-显示窗口、消息循环、消息队列 本文目录 键盘消息键盘消息的分类WM_CHAR 字符消息 鼠标消息鼠标消息附带信息 定时器消息 WM_TIMER创建销毁定时器 菜单资源资源相关菜单资源使用命令消息的…

634 · 单词矩阵

链接&#xff1a;LintCode 炼码 - ChatGPT&#xff01;更高效的学习体验&#xff01; . - 力扣&#xff08;LeetCode&#xff09; 题解&#xff1a; class Solution { public: struct Trie {Trie() {next.resize(26, nullptr);end false;} std::vector<Trie*> next; b…

Python高级进阶--dict字典

dict字典⭐⭐ 1. 字典简介 dictionary&#xff08;字典&#xff09; 是 除列表以外 Python 之中 最灵活 的数据类型&#xff0c;类型为dict 字典同样可以用来存储多个数据字典使用键值对存储数据 2. 字典的定义 字典用{}定义键值对之间使用,分隔键和值之间使用:分隔 d {中…

DT浏览器有一些特点和优势,可能是人们选择使用的原因

DT浏览器有一些特点和优势&#xff0c;可能是人们选择使用的原因&#xff1a; - 好评如潮&#xff1a;DT浏览器在网络上获得了众多用户的好评&#xff0c;口碑良好。 - 使用微软搜索引擎技术&#xff1a;DT浏览器采用了微软的搜索引擎技术&#xff0c;在搜索内容上提供了国内…

Unity 实现心电图波形播放(需波形图图片)

实现 在Hierarchy 面板从2D Object 中新建一个Sprite&#xff0c;将波形图图片的赋给Sprite。 修改Sprite 的Sprite Renderer 组件中Draw Mode 为Tiled, 修改Sprite Renderer 的Size 即可实现波形图播放。 在Hierarchy 面板从2D Object 中新建一个Sprite Mask 并赋以遮罩图片…

【qt】标准型模型 下

标准型模型 一.前言二.预览数据1.获取表头2.获取数据项 三.保存文件1.文件对话框获取保存文件名2.用文件名初始化文件对象3.打开文件对象4.用文件对象初始化文本流5.写入数据 四.格式1.居右2.居中3.居左4.粗体 五.模型的信号1.解决粗体action问题2.状态栏显示信息 六.总结 一.前…

HarmonyOS鸿蒙应用开发——安装与配置

今天脑子又抽风&#xff0c;前端转完学后端之后&#xff0c;今天大周末早上醒来突然又想学鸿蒙了&#xff0c;刚好有个比赛需要用到鸿蒙&#xff0c;于是乎我就随便点开b站看了一下鸿蒙视频&#xff0c;然后马上来写这篇博客&#xff0c;后续我的鸿蒙的博客可能会跳着、不连续地…