SweetAlert :需要增加文本区域的大小

Question

我无法提高text-area的甜蜜提醒，pops-up，我想要重置它根据我的规格，我能够增加模态的高度和宽度，而不是text-area。需要这方面的投入

在CSS中尝试了.swal-height和.swal-width，并给出了适当的classname。但无法设置text-area大小。

handleDelete() {

var delreq;
var response_data;
var response_jsonObj;


swal("Enter notes:", {
  content: "input",
}).then((value) => {
  isDeleted = "Yes";
delreq = {
  "DeleteRequest":
    [
      {
        "Param-1": val1,
        "Param-2": val2,
        "Param-3": "val3",
        "Param-4": val4,
        "Param-5": val5
      }
    ]
};
console.log('delreq',delreq);
fetch('API_URL', {
  headers: {
    'Accept': 'application/json, text/plain, application/xml,  */*',
    'Content-Type': 'application/json',
    'Access-Control-Allow-Headers': 'Content-Type',
  },
  method: 'POST',
  body: JSON.stringify(delreq)
}
).then(response => {
  if (response.status !== 200) {

    return;
  }
  response.text().then(data => {

    response_data = data;
    response_jsonObj = JSON.parse(response_data);
    this.setState({ delval: response_jsonObj });

  });
}).catch(error => this.setState({ error }));

swal({
  title: "Deleted Successfully!",
  icon: "success",
  confirmButtonText: 'OK'
}).then((okay) => {
  if (okay) {
    history.push('/page1');
    history.push('/page2');
  }
});
});

}

希望text-area比现在出现的要大。

Answer 1

这个问题已经解决了。我使用了SweetAlert的最新版本，即Sweetalert2，这使我变得更容易了。我使用了SweetAlert2 2官方网站(https://sweetalert2.github.io/)的代码片段来完成任务。下面是：

Swal.fire({
  title: 'Submit your Github username',
  input: 'text',
  inputAttributes: {
    autocapitalize: 'off'
  },
  showCancelButton: true,
  confirmButtonText: 'Look up',
  showLoaderOnConfirm: true,
  preConfirm: (login) => {
    return fetch(`//api.github.com/users/${login}`)
      .then(response => {
        if (!response.ok) {
          throw new Error(response.statusText)
        }
        return response.json()
      })
      .catch(error => {
        Swal.showValidationMessage(
          `Request failed: ${error}`
        )
      })
  },
  allowOutsideClick: () => !Swal.isLoading()
}).then((result) => {
  if (result.value) {
    Swal.fire({
      title: `${result.value.login}'s avatar`,
      imageUrl: result.value.avatar_url
    })
  }
})

Answer 2

就像上面一样，尝试使用SweetAlert 2代替，我有一个类似的问题，只是把

.swal2-popup {
  font-size: 1.6rem !important;
}

关于您模块的CSS样式，这帮助我获得了文本和文本，我猜是自动大小取决于您的字体大小。